理解vue中的 slot-scope=“scope“

terry VueJs 285

回复

共1条回复 我来回复
  • 冒牌SEO
    冒牌SEO
    前端开发者,欢迎大家一起沟通和交流。
    评论

    slot是插槽,slot-scope=”scope”相当于一行的数据。

    <el-table-column label=”状态” prop=”status”>
    <template slot-scope=”scope”>
    <span>
    {{scope.row.status == “0”?”状态0″:scope.row.status == “1”?”状态1″:”状态2″}}
    </span>
    </template>
    <el-table-column>

    此外还有一些编辑删除等功能
    scope.$index 就是该行的下标
    scope.row 就是该行的数据所有消息对象

    <el-table-column lable=”操作”>
    <template slot-scope=”scope”>
    <Button size=”mini” lable=”编辑” type=”primary”
    @click=”edit(scope.$index,scope.row,’1′)”:disabled=”scope.row.status ==’2’||scope.row.status ==’1′>
    </Button>
    <Button>~~~</Button>
    <Button>~~~</Button>
    </template>
    </el-table-column>

    1年前 0条评论