scope：

<template>
    <section>
        <slot-child>
            <template slot-scope="scope">
                <div>{{scope.nickName}}</div>
            </template>
        </slot-child>
    </section>
</template>

作用域插槽 ：个人理解 在某个组件内部，再次使用某个组件

实战案例为：

<!-- 用户列表区 -->
<el-table :data="UserList" style="width: 100%" border stripe>
  <el-table-column type="index"> </el-table-column>
  <el-table-column prop="username" label="姓名"> </el-table-column>
  <el-table-column prop="email" label="邮箱"> </el-table-column>
  <el-table-column prop="mobile" label="电话"> </el-table-column>
  <el-table-column prop="role_name" label="角色"> </el-table-column>
  <el-table-column label="状态">
    <template slot-scope="scope">
      <el-switch
        v-model="scope.row.mg_state"
        @change="userStateChange(scope.row)"
      >
      </el-switch>
    </template>
  </el-table-column>
  <el-table-column label="操作" width="180px">
    <template slot-scope="scope">
      <!-- 修改按钮 -->
      <el-button
        type="primary"
        icon="el-icon-edit"
        size="mini"
      ></el-button>
      <!-- 删除按钮 -->
      <el-button
        type="danger"
        icon="el-icon-delete"
        size="mini"
        @click="delUser(scope)"
      ></el-button>
      <!-- 分配角色按钮 -->
      <el-tooltip
        effect="dark"
        content="分配角色"
        placement="top"
        :enterable="false"
      >
        <el-button
          type="warning"
          icon="el-icon-setting"
          size="mini"
        ></el-button>
      </el-tooltip>
    </template>
  </el-table-column>
</el-table>

el-table是一个组件， 我们在组件内部使用了一个模板

<template slot-scope="scope">
      <!-- 修改按钮 -->
      <el-button
        type="primary"
        icon="el-icon-edit"
        size="mini"
      ></el-button>
      <!-- 删除按钮 -->
      <el-button
        type="danger"
        icon="el-icon-delete"
        size="mini"
        @click="delUser(scope)"
      ></el-button>
      <!-- 分配角色按钮 -->
      <el-tooltip
        effect="dark"
        content="分配角色"
        placement="top"
        :enterable="false"
      >
        <el-button
          type="warning"
          icon="el-icon-setting"
          size="mini"
        ></el-button>
      </el-tooltip>
    </template>

将其插入在组件中

其中我们重点要理解scope scope

所以当我们访问scope.row就是访问该行数据

<br/>

自行完成删除用户代码

async delUser(row) {
  const { data: res } = await this.$http.delete(`users/${row.id}`)
  if (res.meta.status !== 200) {
    userinfo.mg_state = !userinfo.mg_state
    return this.$message.error('用户删除失败')
  }
  this.$message.success('用户删除成功!')
  this.getUserList()

input 输入框 绑定 keydown.enter事件无法触发

加上.native覆盖原有封装的keyup,keydown事件即可

@keyup.enter.native="changeUser" 这样即可触发

<br/>

码云和本地实战的话 每次一个新功能先提交到一个新的分支， 然后将新分支提交到云端

然后再该分支完成开发后 上传到云端

然后切换回主分支，然后合并分支 然后再上传到云端

如果没完成 记得切换回来

git branch //查看当前分支
git checkout -b rights //创建新分支 并切换 
git push -u origin rights //将本地分支推送到云端  新分支要加-u origin

git checkout master //是切换回主分支
git merge user //将user分支合并到主分支
git push //如果分支有 直接push就可以