javascript - React Component as Const select onChange 传递选定值

标签 javascript reactjs

我有一个作为 const 和 props 创建的 React 组件。

我还有一个函数,请参阅:selectChanged() {} 是另一个文件,当我更改选择值时返回未定义。

这是组件代码:

... 

const myComponent = (props) => <div id="myid">
    <form onSubmit={props.onSubmit} className="gs-form">

        <div className="label">MySelect</div>
            <select
                id="myselect"
                value=""
                onChange={props.selectChanged}>
                <option value="one" defaultValue>one</option>
                <option value="two">two</option>
                <option value="three">three</option>
            </select>
        </div>
    </form>
</div>;

export default myComponent;

数据被传递给这个:

selectChanged(value) {

    console.info(value);

}

问题是它一直显示未定义我更改选择值的内容。

我该如何解决这个问题,以便“selectChanged”传递所选 select 的值?

最佳答案

change= (event) => {
         this.props({selectChanged: event.target.value});
     }
...


<select
    id="myselect"
    value={this.props.selectChanged}
    onChange={this.change}>
    <option value="one" defaultValue>one</option>
    <option value="two">two</option
    <option value="three">three</option>
</select>

关于javascript - React Component as Const select onChange 传递选定值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53449672/

相关文章:

javascript - 使用 C# 的 Asp.Net,单击 Datagrid 行时打开 Web 表单

javascript - 为什么我的 Canvas 仅在刷新时加载?

reactjs - 在休息编辑时访问管理员中的当前记录

javascript - 使用 moment js 进行 DOB 验证

javascript - 如何禁止某人在 iframe 中加载页面并使用 javascript 提交?

javascript - 检查 Vue 中是否为 null 或空格

reactjs - 是否安全地在客户端创建带有 token 的 cookie?

javascript - 使用 React hook setState 更改数组中的变量

javascript - 无法让 React 页面呈现

javascript - 在 React Router 中渲染多个组件