reactjs – 如何检查对象是否在Mobx可观察数组中？

发布时间：2020-12-15 20:13:29 所属栏目：百科来源：网络整理

导读：我在React组件中使用indexOf来根据对象是否在mobx可观察数组中来设置按钮的样式. 该按钮用于收藏.它将该特定列表项的对象推送到名为“favorites”的商店中的可观察数组中.收藏夹是一个可观察的对象数组. 这是我的按钮中的ES6模板文字： className={`btn-grou

我在React组件中使用indexOf来根据对象是否在mobx可观察数组中来设置按钮的样式.

该按钮用于收藏.它将该特定列表项的对象推送到名为“favorites”的商店中的可观察数组中.收藏夹是一个可观察的对象数组.

这是我的按钮中的ES6模板文字：

className={`btn-group ${((this.props.store.favorites.indexOf(this.props.data) > -1)) ? 'success' : 'info'}`}

基本上,它检查对象是否在数组中,如果为false,则className将成功.

当收藏夹数组处于本地状态时,这非常正常.但是我发现收藏夹数组中的对象在可观察数组中看起来有所不同.我得到的是可观察数组的收藏夹与本地数组收藏夹不同.

但是,如何测试对象是否在可观察的对象数组中呢？我尝试了slice()和peek()并使用了findIndex但没有骰子.

解决方法

关于 doc: isObservableArray

Returns true if the given object is an array that was made observable using mobx.observable(array).

因此要知道数据是否在可观察的收藏夹数组中：

// If data is a primitive
className={`btn-group ${mobx.isObservableArray(this.props.store.favorites) && this.props.store.favorites.indexOf(this.props.data) > -1 ? 'success' : 'info'}`}

// Id data is an object it is a little more verbose and coupled to your data
// structure. You have to use the `find` function to iterate and test if an 
// element in the array has the same id.
className={`btn-group ${mobx.isObservableArray(this.props.store.favorites) && !!this.props.store.favorites.find(fav => fav.id === this.props.data.id) ? 'success' : 'info'}`}

这是一个带有函数助手的POC：https://jsbin.com/botijom/edit?js,console

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!