您可以在React的输入值中运行函数吗？

Question

我想运行一个函数并在输入值中传递一些参数，但这给了我这个错误： Invalid value for prop值on <input> tag. Either remove it from the element, or pass a string or number value to keep it in the DOM.

我记得曾经读过某个地方，您可以在value中使用函数，但这对我不起作用。还有另一种方法。

value={() => this.handleMapping(row.servername,  "Data Source Server")} 

错误：Invalid value for prop值on <input> tag. Either remove it from the element, or pass a string or number value to keep it in the DOM.

Answer 1

您在此处提供了匿名功能，

value={() => this.handleMapping(row.servername,  "Data Source Server")} 

相反，您只需要提供在组件加载时执行的功能即可。

value={this.handleMapping(row.servername,  "Data Source Server")} 

还请确保您的handleMapping函数应返回可被视为输入值的值。

Simplified Demo

注意：还要确保在输入时提供onChange处理程序。

Answer 2

您无法执行/运行函数，因为需要一些事件来执行它，但是只有返回一些整数或字符串时才能在值中使用函数。