mapProps介绍
mapProps
函数接收一个函数参数,这个函数参数会返回一个对象用作为接下来的组件的props
。组件接收到的props
只能是通过mapProps
函数参数返回的对象,其他的props
将会被忽略
mapProps 实例
const Item = ['a', 'b', 'c', 'd'];
const ListMap = mapProps(({ list }) => {
return {
list: list.map((e) => e + '_extends')
};
})(List);
现在可以调用ListMap
组件,并且可以给它传递一个list
属性<ListMap list={Item} />
,在List
组件中获取到的list
数组值每个后缀都会被加上_extends
字符。并且如果你还有其他额外的props
传入会被过滤掉比如<ListMap list={Item} title="hello"/>
,在List组件中并不会接收到title
属性。
在线DEMO
在codepen在线预览
备注
我至少每周会更新4个左右的api使用指南,欢迎关注