Vue學習Day09-關於scope.row

關於slot.row沒有徹底理解,暫且先挖個坑,後面學習明白了再補充一下.

<el-table :data="userList" stripe style="width: 100%">
      <el-table-column prop="username"label="姓名" width="180"></el-table-column>
      <el-table-column prop="email" label="郵箱" width="180"> </el-table-column>
      <el-table-column prop="mobile" label="電話"> </el-table-column>
      <el-table-column label="用戶狀態">
        <template slot-scope="scope">
          <el-switch v-model="scope.row.mg_state" @change="userstateChange(scope.row.id, scope.row.mg_state)">
          </el-switch>
        </template>
      </el-table-column>
      <el-table-column prop="adress" label="操做"> </el-table-column>
</el-table>

1.------------->   :data="userList"

表格綁定了用於存儲數據的數組,裏面每個元素都是數據對象

2.------------->   slot-scope="scope"

這是做用域插槽中定義一個對象(這裏對象被定義爲scope)來存儲插槽上綁定的數據的用法

3.------------->   scope.row

在這裏使用ElementUI表格模板渲染數據時,

"當前行數據的獲取也會用到插槽,scope至關於一行的數據， scope.row至關於當前行的數據對象,"(這是在網上看到的一個解釋,暫且記下)