vue 多个input 编辑时监听

Question

想在这种情况下，当修改其中一个input时，显示对应的确定button，怎么才能监听到<div v-for="n in fruit">            <div>                <input type="text" name="" :value="n.apples">                <button>确定</button>            </div>            <div>                <input type="text" name="" :value="n.oranges">                <button>确定</button>            </div>            <div>                <input type="text" name="" :value="n.bananas">                <button>确定</button>            </div>            <div>                <input type="text" name="" :value="n.peachs">                <button>确定</button>            </div>        </div>data:{    fruit: [        {'apples': 54},        {'oranges': 12},        {'bananas': 4},        {'peachs': 45},    ]}

Answer 1

可以做成一个组件，包含一个 input 和一个 button，button 设置条件渲染，然后在 input 元素上绑定 input 事件设置 button 条件渲染的条件变量为 true。

数据以及 确定 按钮的 点击事件通过 props 传递进这个组件。