小编use*_*016的帖子

如何在react-virtualized autosizer中包装material-ui ListItem

我使用的是material-ui的List和ListItem组件.具体来说,我使用的是嵌套项功能.请参阅http://www.material-ui.com/#/components/list ,在页面的下半部分,您将看到嵌套列表.重点是:material-ui负责"嵌套"问题,例如缩进以及扩展/收缩箭头.

一旦我添加了很多项目,我意识到列表非常慢.所以我偶然发现了AutoSizer的反应虚拟化.问题是:在反应虚拟化中,我的代码需要为每一行提供rowRenderer函数.我不想丢失内置的材料-ui功能,可以找出嵌套项目的缩进.然而,使用AutoSizer似乎我的代码需要做自定义工作来找出缩进.我的代码也将提供扩展/合同箭头.目前它是免费的材料-ui的List/ListItem.

任何提示或建议?

谢谢

list material-ui react-virtualized

15
推荐指数
1
解决办法
2231
查看次数

获取React组件propTypes定义的类型

假设以下代码:

TestComponent.propTypes = {
  text: React.PropTypes.string,
  myEnum: React.PropTypes.oneOf(['News', 'Photos'])
};
Run Code Online (Sandbox Code Playgroud)

我在另一个文件(使用TestComponent)中执行了以下操作:

if (TestComponent.propTypes.text === React.PropTypes.string) {...}

if (TestComponent.propTypes.myEnum === React.PropTypes.oneOf) {...}
Run Code Online (Sandbox Code Playgroud)

嗯,令我满意的是第一个如果工作.但第二个如果永远不会真实.我尝试将其修改为下面的语法,但它没有帮助.

if (TestComponent.propTypes.myEnum === React.PropTypes.oneOf(['News', 'Photos'])) {...}
Run Code Online (Sandbox Code Playgroud)

所以,问题是:有什么机制来发现道具的类型?我知道React会针对propType测试prop的值来验证它.但是,我还需要访问"预期类型"以完成我的工作.

顺便说一下,这里是React代码的摘录,用于验证propTypes(为简洁起见缩短):

function createPrimitiveTypeChecker(expectedType) {
  function validate(props, propName, componentName, location, propFullName){      
    var propValue = props[propName];
    var propType = getPropType(propValue);
    if (propType !== expectedType) {
      // return some Error
     }
     return null;
  }
  return createChainableTypeChecker(validate);
}
Run Code Online (Sandbox Code Playgroud)

如您所见,外部函数的参数是expectedType.它用在内部验证函数中(if(propType!== expectedType)).但是,React不会将expectedType保存到成员变量中,以便外部代码可以访问它.那么外部代码如何找出propType的类型?

我的观点是不要"验证"道具的具体价值.React很好地处理了这个问题.我的观点是根据prop类型做一些特定的逻辑,我无法使用anyOf,objectOf,shape等类型.

有什么想法,建议??

4
推荐指数
1
解决办法
2286
查看次数

标签 统计

list ×1

material-ui ×1

react-virtualized ×1