全部开发者教程

企业级在线办公系统

上个小节我们用Swagger测试了后端的Web方法,成功的修改了用户信息。那么本小节我们要完成的是前端页面的JS程序。因为新增用户和修改用户的弹窗页面是相同的,所以这里我就不配图了。

在user.vue页面中为更新按钮设置点击事件回调函数,这样才能显示弹窗页面。

<el-table-column fixed="right" header-align="center" align="center" 
                 width="150" label="操作">
    <template #default="scope">
        <el-button type="text" size="medium" v-if="isAuth(['ROOT', 'USER:UPDATE'])" 
                   @click="updateHandle(scope.row.id)">
						修改
        </el-button>
        ……
    </template>
</el-table-column>

updateHandle: function(id) {
    this.addOrUpdateVisible = true;
    this.$nextTick(() => {
        this.$refs.addOrUpdate.init(id);
    });
},
索引目录