Javascript TypeError:无法读取属性';存在';未定义的 我正在尝试为jsx文件编写一个测试用例 在这方面,我能够通过proptypes 但不是在我顺利通过的地方 我在运行测试用例时出错 下面提供我的错误、测试用例和代码 TypeError:无法读取未定义的属性“exists” 不确定如何使其与此一起工作存在 它发生在这个函数dispatchSidebarExists 你能告诉我应该如何把它放在我的测试用例中吗
javascript 错误Javascript TypeError:无法读取属性';存在';未定义的 我正在尝试为jsx文件编写一个测试用例 在这方面,我能够通过proptypes 但不是在我顺利通过的地方 我在运行测试用例时出错 下面提供我的错误、测试用例和代码 TypeError:无法读取未定义的属性“exists” 不确定如何使其与此一起工作存在 它发生在这个函数dispatchSidebarExists 你能告诉我应该如何把它放在我的测试用例中吗,javascript,jquery,html,reactjs,mocha.js,Javascript,Jquery,Html,Reactjs,Mocha.js,javascript 错误 1) shallow renderer tests for sports-template-standard should render correctly: TypeError: Cannot read property 'exists' of undefined at [object Object].dispatchSidebarExists (/src/sports-template-standard.jsx:80:56)
1) shallow renderer tests for sports-template-standard should render correctly:
TypeError: Cannot read property 'exists' of undefined
at [object Object].dispatchSidebarExists (/src/sports-template-standard.jsx:80:56)
at [object Object].componentWillMount (/src/sports-template-standard.jsx:49:14)
at [object Object].ReactCompositeComponentMixin.mountComponent (\node_modules\react\lib\ReactCompositeComponent.js:210:12)
at [object Object].wrapper [as mountComponent] (\node_modules\react\lib\ReactPerf.js:66:21)
at [object Object].ReactShallowRenderer._render (\node_modules\react\lib\ReactTestUtils.js:362:14)
at [object Object].ReactShallowRenderer.render (\node_modules\react\lib\ReactTestUtils.js:344:8)
at Context.<anonymous> (/test/sports-template-standard-tests.js:31:25)
at callFn (\node_modules\mocha\lib\runnable.js:286:21)
at Test.Runnable.run (\node_modules\mocha\lib\runnable.js:279:7)
at Runner.runTest (\node_modules\mocha\lib\runner.js:421:10)
at \node_modules\mocha\lib\runner.js:528:12
at next (\node_modules\mocha\lib\runner.js:341:14)
at \node_modules\mocha\lib\runner.js:351:7
at next (\node_modules\mocha\lib\runner.js:283:14)
at Immediate._onImmediate (\node_modules\mocha\lib\runner.js:319:5)
整个代码
`javascript`
dispatchSidebarExists(props) {
let hasSidebar = !!props.sidebar;
// infinite loop without this check
if (hasSidebar !== this.props.layout.rightPanel.exists) {
this.props.dispatch(setSportsCornerState({
exists: hasSidebar
}));
}
}
export function setSportsCornerState(stateString) { return { type: 'SET_HEADERPANEL', stateString }; } ```
新警告
Warning: Failed propType: Invalid prop `sidebar` supplied to `sportsMockUpStandard`.
// var rightPanel ="some string";
var layout ="some string";
var hasSidebar = function(){
// done();
}
console.log("here1");
// this.props.layout.rightPanel.exists = 'some value';
shallowRenderer.render(<sportsMockUpStandard
headerClass='8887'
layout= {{rightPanel: {exists: hasSidebar}, text: 'hello world'}}
sidebar= {[{hasSidebar},{id: 100, text: 'hello world'}]}
title={"Demo"} dispatch={hasSidebar} />);
警告:失败的道具类型:为“sportsMockUpStandard”提供的道具“边栏”无效。
//var rightPanel=“一些字符串”;
var layout=“一些字符串”;
var hasSidebar=函数(){
//完成();
}
控制台日志(“此处1”);
//this.props.layout.rightPanel.exists='some value';
shallewrender.render();
基本上,您的reducer正在调用状态上的属性exists
,对吗?但它找不到它?这是因为您已调度了一个对象,但尚未添加有效负载
你的代码说你像这样分派对象
setSportsCornerState(stateString) {
return { type: 'SET_HEADERPANEL', stateString };
}
{ type: 'SET_HEADERPANEL', {exists: hasSidebar} }
在这里给出你的代码
this.props.dispatch(setSportsCornerState({
exists: hasSidebar
}));
。。。。这意味着您要分派的对象将如下所示
setSportsCornerState(stateString) {
return { type: 'SET_HEADERPANEL', stateString };
}
{ type: 'SET_HEADERPANEL', {exists: hasSidebar} }
实际上,我不确定在这种情况下属性是如何命名的,如果其中有一个对象和另一个没有属性名的对象。这就是说,这就是你的物体应该是什么样子
{ type: 'SET_HEADERPANEL', payload: {exists: hasSidebar} }
如果要将信息传递给减速器,则需要通过payload属性传递信息。您的对象应该始终具有有效负载,并且该有效负载应该始终是一个对象。将代码更改为以下内容
export function setSportsCornerState(stateString) {
return { type: 'SET_HEADERPANEL', payload: stateString };
}
此集合将有效负载对象作为要传递的信息。然后,您的reducer应该查找有效负载对象上的
exists
属性 @all为什么你们把它标记为负数…因为我也尝试粘贴了我的代码:(你能发布setSportsCornerState
的代码吗?它是否返回一个具有有效负载属性的对象?这看起来不像我见过的redux分派,它们通常有一个操作和有效负载,但我猜这些内容是通过该方法返回的?因为如果不是,我打赌这是你的问题。@OceansOnPluto嘿,谢谢你的回答。@OceansOnPluto…我对你的解释有点困惑…在下面提供我的代码``导出函数SetPortsCornerState(stateString){return{type:'SET_HEADERPANEL',stateString};}````` OceansOnPluto我是js初学者…你能在我的测试用例中更新吗:(谢谢你的回复…你能在下面更新测试用例的要点吗?我的意思是,这不是这个网站真正的工作方式,通常你会尝试一下,看看它是否工作,你是否接受我的答案。但是,你需要更改代码。除非你添加有效负载属性,否则测试用例将总是失败的,因为redux没有被设置为在其他任何情况下工作。)好的…但是测试代码中的这一行我应该如何修改``sidebar={[{hasSidebar},{id:100,text:'hello world'}}}``只要将函数更改为我在上一个代码块中详细描述的函数,看看是否有效。好的…但是测试代码中的这一行我应该如何修改``sidebar={[{hasSidebar},{id:100,text:'hello world'}}} ```