小编vij*_*ode的帖子

我正在尝试在我的反应形式中使用Yupwith Formik。表单字段将是动态的，以便进行验证。

export const formData = [
  {
    id: "name",
    label: "Full name",
    placeholder: "Enter full name",
    type: "text",
    required: true,
    value: "User name",
    values: [],
    validations: [
      {
        type: "minLength",
        value: "5",
        error_message: "name should be atleast 5 char long"
      },
      {
        type: "maxLength",
        value: "10",
        error_message: "name should be atleast 5 char long"
      }
    ]
  },
  {
    id: "email",
    label: "Email",
    placeholder: "Email",
    type: "text",
    required: true,
    value: "email",
    values: [],
    validations: [
      {
        type: …

我刚刚遇到了一个 React 代码，我不确定它是否是一个好方法。这是该代码的示例实现。

class App extends React.Component {
  renderMessage = () => {
    function getMessage() {
      return "Hello"
    } 
    function getName() {
      return "Vijay"
    }
    return (
      <h1>{getMessage()} {getName()} !!!</h1>
    )
  }
  render() {
    return (
      <div>
        {this.renderMessage()}
      </div>
    )
  }
}

在这里，我们renderMessage在渲染内部调用一个函数。在renderMessage有被称为内部两个内功能renderMessage只。我现在的问题是：-

• 这是一个很好的方法吗？会不会重新声明它的方法getName和getMessage在每一个render电话。
• 如果我制作getName和getMessage分类方法并在内部调用它们renderMessage会是一种改进吗？

谢谢 ：）

有什么方法可以在创建表单后立即自动提交表单吗？我有一个组件<ShowVideo />。在这个组件中，我正在调度一个操作，该操作将给出一些hidden field和signatures。然后，我在页面上呈现此表单。我想要的是在渲染表单后动态提交此表单。可以有多种形式。

handleSubmit我想到的一种方法是在标签之后调用另一个函数form，该函数内部有form.submit()方法，但我如何确保整个表单是否被渲染。

class ShowVideo extends Component {
  render() {
    let renderInputFields = null
    if (this.props.videoData.data.hasOwnProperty("signature")) {
      renderInputFields = Object.keys(launchData).map((key, i) => {
        return (<input type="hidden" name={key} key={i} value={launchData[key]} />)
      })
    }
    return (
      <div>
        <iframe width="100%" height="430px" frameBorder="0" name="videoIframe"></iframe>
        <form name="ltiLaunchForm" id="ltiLaunchForm" method="post" target="target_iframe" encType="application/x-www-form-urlencoded" action={launchUrl}>
          {renderInputFields}
          <input type="hidden" name="oauth_signature" value={signature} />
        </form>
      </div>
    )
  }
}

我正在尝试在JavaScript中创建一个待办事项列表,其中列表是在提交输入时动态创建的.我想要的是任务列表和除了它们之外的删除按钮.除了我无法使用javascript向按钮添加类之外.

这是我的代码..

<button id="add" onclick="takeInput()">Add new task</button>

<script>
function takeInput()
{
  var task=prompt("Enter the new to do work");
  if(task!=null)
  {
    var list=document.createElement("li");
    var btn=document.createElement("button");
    var data=document.createTextNode(person);
    var btndata=document.createTextNode("delete");
    list.appendChild(data);
    btn.appendChild(btndata);
    document.getElementById("list").appendChild(list);
    document.getElementById("list").appendChild(btn);

  }
}
</script>

我想用Drawer component在Material-UI React。我希望里面的状态Drawer component在关闭Drawer组件时不应该丢失，因此我传入variant="persistent"了Drawer组件。

现在的问题是，默认情况下，抽屉Persistent Drawer不提供抽屉，因此我无法在外部点击时将其关闭。我也尝试过，但仍然无法正常工作。backdrop functionalitytemporary{{ModalProps={{ onBackdropClick: this.toggleDrawer }} }}

有什么解决方法吗？

材质用户界面版本：1.0.0

谢谢

CodeSandbox链接