当前位置: 首页 > 面试题库 >

React中的真实自定义属性(例如,微数据)

东方智敏
2023-03-14
问题内容

我正在开发的网站利用了微数据(使用schema.org)。当我们将开发转移到使用React渲染视图时,我遇到了一个障碍,在该障碍中,React仅会渲染HTML规范中的属性,而Microdata指定了诸如的自定义属性itemscope

因为我对React还是比较陌生,还没有机会完全了解内核,所以我的问题是,扩展react.js功能以允许定义的自定义属性(例如微数据)的最佳方法是什么?

是否有扩展属性/道具解析器的方法,还是混合检查的工作,它可以检查所有传递的道具并直接修改DOM元素?

(希望我们能够将扩展扩展放在一起,以便每个人在解决方案明确时对此提供支持。)


问题答案:

您应该能够做到componentDidMount

...
componentDidMount: function() {
  if (this.props.itemtype) {
    this.getDOMNode().setAttribute('itemscope', true)
    this.getDOMNode().setAttribute('itemtype', this.props.itemtype)
  }

  if (this.props.itemprop) {
    this.getDOMNode().setAttribute('itemprop', this.props.itemprop)
  }
}
...

为了方便起见,可以将整个Microdata属性检查包装到mixin中。
这种方法的问题在于它不适用于内置的React组件(由创建的组件 React.DOM。更新:仔细看一下React.DOM,我想到了这个http://plnkr.co/edit/UjXSveVHdj8T3xnyhmKb?p=preview。基本上,我们使用mixin将内置组件包装在自定义组件中。由于您的组件是基于React的内置DOM组件构建的,因此无需在组件中包含mixin即可使用。

真正的解决方案是注入自定义配置而不是React
DefaultDOMPropertyConfig,但是我找不到以直接插入的方式(DOMProperty被模块系统隐藏)的方法。



 类似资料:
  • 问题内容: 作为一个例子,取子域映射。 然后,映射将如下所示: 如果我们想创建自定义的@RequestMapping属性,例如子域。创建这样的映射: 我们应该使用我们自己的实现覆盖定义并覆盖RequestMappingHandlerMapping受保护的方法 (如JIRA所述:“ 允许自定义请求映射条件SPR-7812 ”)。 这样对吗?有人可以提供提示,如何实现此功能吗? 想法1: 正如原始的j

  • 本文:在Google App Engine上管理同一应用程序的多个域和子域,建议在筛选器上解析子域,并将变量分配给ServletRequest头。 那么映射将如下所示: 如果我们想创建自定义的@RequestMapping属性,比如subdomain,例如。要创建如下所示的映射: 也许像这样的类型和方法映射是可能的解决方案? 链接到forum.springsource.com上的相同问题

  • 试图向OpenLDAP添加一个新属性,但总是碰壁。我正在尝试向架构添加ipPhone属性,因为我不能在默认的telephoneNumber属性中包含*数字。 下面是我的LDIF文件,用于创建新属性并将其与objectClass类似。 我已经测试和谷歌了几个小时,但一直无法解决这个问题或找出我错过了什么!

  • 我刚刚用打字稿开始了一个新的反应项目,在功能组件中定义自定义道具时遇到了困难。 我查找了如何定义自定义道具,并找到了一种定义接口的方法,该接口详细描述了我传递给函数的道具类型,但是当我试图在我的主应用程序上运行它时,我得到一个错误消息 类型“{ digit: number; }”不能分配给类型“IntrinsicAttributes”。属性“数字”在类型“内部属性”上不存在。TS2322 我的代码

  • React能够按照http://facebook.github.io/React/docs/jsx-gotchas.html中的描述呈现自定义属性: 如果您想使用一个自定义属性,您应该在它前面加上data-。 这是个好消息,但我找不到从事件对象访问它的方法,例如: 元素和属性以html格式呈现。像这样的标准属性可以作为fine访问。而不是: 这些都没用。 匿名用户 以一种可能与您所要求的不同的方式

  • 问题内容: 如http://facebook.github.io/react/docs/jsx- gotchas.html 所述,React能够呈现自定义属性 : 如果要使用自定义属性,则应在其前面加上data-。 那是个好消息,除了我找不到从事件对象访问它的方法,例如: 元素和属性以html呈现。可以像这样访问标准属性。而不是我尝试: 这些都不起作用。 问题答案: 为了帮助您以与要求不同的方式获