vue项目中如何做到点击表头，对应列进入可编辑状态？

Question

用户表格中要求新增一列自定义名称，点击表头的自定义名称后，该列均进入可编辑模式，
起初想的是v-if 控制的label和input切换（代码如下），但是并不起效果。另外也觉得这样做很蠢，请问有什么更好的办法吗？

<table class="table baseTable">
    <thead>
        <tr>
            <th>序号</th>
            <th>用户名</th>
            <th>自定义名称<span @click="isEdit=！isEdit">点击这里进入编辑</span></th>
            <th>帐号</th>
        </tr>
    </thead>
    <tbody>
        <tr v-for="(item,index) in infoList" v-bind:key="index">
            <td>{{index+1+10*(currentPage-1)}}</td>
            <td>{{item.displayName}}</td>
            <td>
                <label v-if="isEdit == false">{{item.customName}}</label>
                <div v-else>
                    <input  v-model="item.customName"/>
                    <button @click="isEdit =！isEdit">确定</button>
                </div>
            </td>
            <td>{{item.userName}}</td>
        </tr>
    </tbody>
</table>

Answer 1

你得思路没有错，把你得代码复制出来测试了也没有问题。唯一有问题得地方就是 isEdit=！isEdit 的感叹号是中文的。