vue 点击按钮 弹出来两个input输入框

可以使用Vue的v-if指令来实现点击按钮弹出两个input输入框的效果。具体实现步骤如下：

1. 在Vue实例中定义一个data属性，用于控制是否显示输入框。

data: {
  showInput: false // 初始值为false，不显示输入框
}

2. 在模板中添加一个按钮，用于触发显示输入框的操作，并使用v-if指令根据showInput的值来决定是否显示输入框。

<div>
  <button @click="showInput = true">显示输入框</button>
  <div v-if="showInput">
    <input type="text" placeholder="请输入第一个值">
    <input type="text" placeholder="请输入第二个值">
  </div>
</div>

3. 点击按钮后，showInput的值将变为true，从而显示两个输入框。可以使用v-model指令来绑定输入框的值，实现数据的双向绑定。

<div>
  <button @click="showInput = true">显示输入框</button>
  <div v-if="showInput">
    <input type="text" placeholder="请输入第一个值" v-model="value1">
    <input type="text" placeholder="请输入第二个值" v-model="value2">
  </div>
</div>

完整代码如下：

<div id="app">
  <button @click="showInput = true">显示输入框</button>
  <div v-if="showInput">
    <input type="text" placeholder="请输入第一个值" v-model="value1">
    <input type="text" placeholder="请输入第二个值" v-model="value2">
  </div>
</div>

<script>
new Vue({
  el: '#app',
  data: {
    showInput: false,
    value1: '',
    value2: ''
  }
})
</script>