javascript array.includes在反应中不起作用
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了javascript array.includes在反应中不起作用相关的知识，希望对你有一定的参考价值。
首先，我是前端的新手，所以我对javascript +反应的知识是基于教程的。
我有一个设置为组件属性的对象。该对象具有一个数组作为属性。
所以在组件内部，无论是在函数还是在渲染方法中，如果写一个console.log(object.property)
它打印数组，没有错误。
但是，如果我尝试使用.includes方法
的console.log（object.property.includes（ “字符串”））
它会引发以下错误：
react-dom.development.js？cada：12404 Uncaught TypeError：无法读取未定义的属性'includes'
那么为了使用这个方法，数组如何变成未定义？
我发现的解决方法是这样的：
render() {
let self = this;
let user;
return(
{
this.props.otherarray.map(function(var) {
self.user = self.props.object.property.includes("string")
})
console.log(this.user)
}
);
}
然后它的工作原理。
我错过了什么？它是关于javascript上下文还是反应的东西？
console.log输出误导你。我想object来自异步作业，你在第一次渲染中看到数组为undefined，第二次渲染就是这样。作为undefined不是问题，但如果你尝试在像map这样的不存在的属性上使用方法，includes就是一个问题，你会在你的问题中引用错误。因此，您需要检查此属性是否存在。我不知道你的组件设置，但这是一个例子：
const object = {
property: [ "foo", "bar", "baz" ]
}
const fakeRequest = () => new Promise( resolve =>
setTimeout(() => resolve(object),1000)
);
class App extends React.Component {
state = {
object: {},
}
componentDidMount() {
fakeRequest().then(this.setState({object}))
}
render() {
const { object } = this.state;
object.property && console.log(object.property.includes("foo"))
return <div>Foo</div>;
}
}
ReactDOM.render(<App />, document.getElementById("root"));<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="root"></div>以上是关于javascript array.includes在反应中不起作用的主要内容，如果未能解决你的问题，请参考以下文章
javascript array.includes在反应中不起作用
检查数组中是不是存在迭代器时，array.includes 不起作用[重复]