Question

我想使用功能禁用/启用表单提交按钮这是我的代码来解释我想要的东西：

isDisabled = () => {
    //logic to define if button should be disabled or not
    //return boolean true or false based on that
}


render() {
    return (
        <form className="forgot-password-form">
            //form fields
            <input type="submit" value="Submit" disabled={this.isDisabled} />
        </form>
    );
}

这只是为了表明我想要做的事情:)当然render()将在组件和所有内容中。

目前它给了我警告：

警告：标记上的道具disabled的值无效。将其从元素中删除，或传递字符串或数字值以将其保留在DOM中。

谢谢大家的帮助。

Answer 1

您正在将函数传递给disabled道具，您必须执行此函数来传递此函数的布尔结果：

<input type="submit" value="Submit" disabled={this.isDisabled()}

Answer 2

＆＃13;

    <meta charset="UTF-8">
    <script src="https://unpkg.com/react@0.13.3/dist/react.js"></script>
    <script src="https://unpkg.com/react@0.13.3/dist/JSXTransformer.js"></script>
    <div id="app"></div>
    <script type="text/jsx;harmony=true">void function() { "use strict";

var App = React.createClass({
  getInitialState() {
    return {}
  },
  isDisabled(){
    return true;   // for disable button return true otherwise false
   // return false;
  },
  render() {
    return <div>
<input type="submit" value="Submit" disabled={this.isDisabled()}/>
    
    </div>
  }
})

React.render(<App/>, document.getElementById('app'))

}()</script>

＆＃13;

在React JS USING FUNCTION中禁用/启用提交按钮

2 个答案: