使用Vue公式模式时，是否可以隐藏或显示输入？

如何解决使用Vue公式模式时，是否可以隐藏或显示输入？

我一直在尝试使用Vue Formulate模式创建表单。具体来说，我需要两个单选按钮A和B。单击A时，下面必须显示一个额外的输入字段。单击B时，必须隐藏此输入字段。

使用模式很重要。

有什么想法吗？

解决方法

在Vue Formulate中，模式本身是反应性的，因此使用模式执行条件字段的建议是首先将模式传递给计算的prop。例如：

<template>
  <FormulateForm
    v-model="formValues"
    :schema="conditionalSchema"
  />
</template>

<script>
const schema = [
  {
    type: "radio",options: { a: 'A',b: 'B' },label: 'Do you like a or b?',name: 'question',id: 'question'
  },{
    type: 'text',name: 'c',id: 'c',label: 'If you like b,then you must like c!'
  }
]

export default {
  data () {
    return {
      formValues: {}
    }
  },computed: {
    conditionalSchema() {
      if (this.formValues.question !== 'b') {
        return schema.filter(({ name }) => name !== 'c')
      }
      return schema
    }
  }  
}
</script>

这是CodePen中的代码：https://codepen.io/justin-schroeder/pen/dyXPGQL