slot-scope 插槽 的使用 ——'<template slot-scope="page">'
slot-scope="page"
slot-scope 是一个插槽,拿外面的数据,可以获取当前一行的数据
page.row.pageId 拿到当前行数据的pageId
注意:
slot-scope="A" @click="edit(B.row.pageId)
A和B需要保持一致
<el-table-column label="操作" width="300">
<template slot-scope="page">
<el-button
size="small" type="text"
@click="edit(page.row.pageId)">编辑
</el-button>
<el-button
size="small" type="text"
@click="del(page.row.pageId)">删除
</el-button>
<el-button
@click="preview(page.row.pageId)"
type="text"
size="small">页面预览
</el-button>
<el-button
size="small" type="primary" plain @click="postPage(page.row.pageId)">发布
</el-button>
</template>
</el-table-column>
slot-scope 插槽 的使用 ——'<template slot-scope="page">'的更多相关文章
- vue 中的slot属性(插槽)的使用
总结如下: VUE中关于插槽的文档说明很短,语言又写的很凝练,再加上其和方法,数据,计算机等常用选项在使用频率,使用先后上的差别,这就有可能造成初次接触插槽的开发者容易产生“算了吧,回头再学,反正已经 ...
- vue中的slot(插槽)
vue中的插槽----slot 什么是插槽? 插槽(Slot)是Vue提出来的一个概念,正如名字一样,插槽用于决定将所携带的内容,插入到指定的某个位置,从而使模板分块,具有模块化的特质和更大的重用性. ...
- Web Components & HTML5 & template & slot
Web Components & HTML5 & template & slot https://developer.mozilla.org/en-US/docs/Web/HT ...
- You Don't Know JS: Scope & Closures (第2章: Lexical Scope)
2种主要的models for how scope work. 最普遍的是Lexical Scope. 另一种 Dynamic Scope.(在Appendix a中介绍.和Lexical Scope ...
- vue学习:props,scope,slot,ref,is,slot,sync等知识点
1.ref :为子组件指定一个索引 ID,给元素或者组件注册引用信息.refs是一个对象,包含所有的ref组件. <div id="parent"> <user- ...
- 理解vue之element-ui中的 <template slot-scope="scope">
https://blog.csdn.net/tg928600774/article/details/81945140?utm_source=blogxgwz1
- angularjs $scope与this的区别,controller as vm有何含义?
壹 ❀ 引 初学angularjs的同学对于$scope一定不会陌生,scope(作用域)是将view(视图)与model(模板)关联起来的桥梁,通过controller(控制器)对于model的数 ...
- Vue官方文档Vue.extend、Vue.component、createElement、$attrs/$listeners、插槽的深入理解
一.Vue.extend({}). 看官网文档介绍,Vue.extend({})返回一个Vue的子类,那么这个Vue子类是啥玩意儿呢?我直观感觉它就是创建出一个组件而已啊,那么它又和Vue.compo ...
- vue插槽的使用
一.插槽的基本使用 二.具名插槽的使用 三.编译作用域的例子 四.作用域插槽 一.插槽的基本使用 1.插槽的基本使用<slot></slot> 2.插槽的默认值 ...
随机推荐
- React Native 中不用手点击,代码实现切换底部tabBar
参考:https://www.jianshu.com/p/02c630ed7725 tabBar1页面有按钮,点击切换到tabBar2 直接用this.props.navigation.navigat ...
- 搭建nginx环境(参考腾讯云实验室)
使用 yum 安装 Nginx: yum install nginx -y 修改 /etc/nginx/conf.d/default.conf,去除对 IPv6 地址的监听,可参考下面的代码示例: s ...
- 批量下载文件php
做了个照片墙,要提供批量下载照片的功能,如果你会文件下载,那批量也是小菜一碟,就是把文件打包压缩为 zip 文件再下载,而php的内置类ZipArchive()让你很容易实现. 首先,配置php.i ...
- [USACO07OPEN]Dining 题解
前言 如果有人不会网络流,那么安利一下我网络最大流Dinic的博客 关于网络流,我多久没有碰这个算法了... 这是一道网络流好题. 题解 这道题目难点主要是构图. 这道题的构图一开始很容易想到建一个超 ...
- 【CF1247F】Tree Factory(构造)
题意:给定一棵n个点的树,要求将一条可以随意标号的链通过若干次操作变成这棵树 一次操作是指若v不为根且v的父亲不为根,则将v以及v的子树移到v的父亲的父亲上 要求给出标号方案,操作次数以及方案 n&l ...
- [ethereum源码分析](5) 创建新账号
前言 在上一章我们介绍了 ethereum运行开启console 的过程,那么在这一章我们将会介绍如何在以太坊中创建一个新的账号.以下的理解可能存在错误,如果各位大虾发现错误,还望指正. 指令分析 指 ...
- hashcode native
hashcode Java中的hashCode方法就是根据一定的规则将与对象相关的信息(比如对象的存储地址,对象的字段等)映射成一个数值,这个数值称作为散列值. 在设计hashCode方法和equal ...
- angular项目开发
第 1 步:安装 Angular CLI 你可以使用 Angular CLI 来创建项目.生成应用和库代码,以及执行各种持续开发任务,比如测试.打包和部署. 全局安装 Angular CLI. 要使用 ...
- jmeter之三种参数化
前言:总结并记录几种jmeter比较有用的元件 1.接口文档 2.参数化 3.断言 1.接口文档 a.拿到接口文档 接口地址:http://localhost:8080/jpress/admin/lo ...
- clientdataset 修改记录 成功
procedure TForm7.Label33Click(Sender: TObject);var i,j,k:integer;begin i:=self.DBGrid1.SelectedField ...