javascript - 带有 React 的会话表单。如何进行多项选择？

Question

我正在使用 React(Next.js)。我有一个很好的例子[https://codepen.io/space10/pen/JMXzGX][1]，如何在简单的 HTML 中使用多项选择，但是如何在 React 中使用它？

这是我的代码

这是我在浏览器中的内容

标签： javascriptreactjsnext.jschatbot

Answer 1

只需继续将对象添加到数组中 - 只要name相同，它似乎就可以组合它。

工作演示：https ://stackblitz.com/edit/react-conversational-form-with-radio

    this.formFields = [
      {
        'tag': 'input',
        'type': 'radio',
        'name': 'country',
        'cf-questions': 'What is your country?',
        'cf-label': 'ukraine',
        'value': 'ukraine',
      },
      {
        'tag': 'input',
        'type': 'radio',
        'name': 'country',
        'cf-label': 'india',
        'value': 'india',
      },
      {
        'tag': 'input',
        'type': 'radio',
        'name': 'country',
        'cf-label': 'sri lanka',
        'value': 'sri lanka',
      },
      {
        'tag': 'input',
        'type': 'text',
        'name': 'lastname',
        'cf-questions': 'What is your lastname?'
      }
    ];

返回类似这样的表单结果：

{ country: ["ukraine"], lastname: 'tasdasd' }