开发者社区> 问答> 正文

使用reactdom在输入后添加跨度

已解决

我正在尝试使用创建一个内嵌的广播/文本/输入表单ReactDOM然而,对于React 15,打开浏览器时出现错误:

Uncaught Invariant Violation: input is a void element tag and must neither have `children` nor use `dangerouslySetInnerHTML`.

引发此错误的代码如下

const D = ReactDOM; //react-dom-factories

D.input({
    type: 'radio',
    className: 'stra-on-loss-return-to-base-radio',
    value: 'return_to_base',
    disabled: this.state.active
},  D.span(null, 'Return to base bet'), D.br()),
D.input({
    type: 'radio',
    className: 'stra-on-loss-increase-bet-by',
    value: 'increase_bet_by',
    disabled: this.state.active
},  D.span(null, 'Increase bet by: '), D.input({
    type: 'text',
    ref: 'onLossQty',
    onChange: this.updateOnLossQty,
    value: this.state.onLossIncreaseQty,
    disabled: this.state.active || this.state.onLossSelectedOpt !== 'increase_bet_by' }
), D.span(null, 'x'))

https://www.npmjs.com/package/react-dom-factories反应堆有问题吗https://pastebin.com/51x23vZy是整个文件的副本

展开
收起
sossssss 2019-12-04 10:12:49 1695 0
1 条回答
写回答
取消 提交回答
  • 采纳回答

    这个错误是说你不能把东西放在input元素。你错过了D.span和D.br的争论,换句话说,你正试图呈现这个(你例子的前半部分):

    <input type="radio">
      <span>
        Return to base bet
      </span>
      <br />
    </input>
    

    HTML不允许怎么样去要,所以react告诉你这是一个错误。所以你需要把input,span,和br放在div内

    D.div(
      null,
      D.input({
        type: 'radio',
        ...
      }),
      D.span(null, 'Return to base bet'),
      D.br()
    )
    
    

    相应的超文本标记语言看起来像

    <div>
      <input type="radio" />
      <span>
        Return to base bet
      </span>
      <br />
    </div>
    

    或者如果你不想要div或是span,你可以做一个React.Fragment

    2019-12-04 10:21:50
    赞同 展开评论 打赏
问答分类:
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载