vue插槽,也就是子页面、父页面相互传值的另一写法
父页面:
<template>
<div class="parent">
<p>父组件</p>
<child>
<div slot='s1'>
<p >插槽1</p>
<p >插槽101</p>
</div>
<p slot='s2'>插槽2</p>
<p slot-scope='props' slot='s3'>
{{props.text}}
</p>
</child>
</div>
</template>
<script>
import child from './child'
export default{
name:'parent',
data(){
return{
}
},
methods:{
},
components:{
child
}
}
</script>
<style>
</style>
子页面:
<template>
<div class="child">
子组件组件
<slot name='s1'></slot>
<hr />
<slot name='s2'></slot>
<slot>子页面自己玩</slot>
<slot name='s3' text='子页面传父页面'></slot>
</div>
</template>
<script>
export default{
name:'child',
data(){
return{
}
},
methods:{
}
}
</script>
<style>
</style>
vue插槽,也就是子页面、父页面相互传值的另一写法的更多相关文章
- iframe中子页面父页面里函数互调
在iframe中很多要用的子页面父页面函数互调的情况,下面看一下各自用法,本人写个人网站的时候用过其他场景尚未试过 子页面调父页面 function fu(){ alert('父'); } funct ...
- react-native页面之间的相互传值
react-native页面之间的相互传值 之前在自己学习react-native的时候,在页面跳转和传值问题上花了一段时间去网上搜索和查找资料,自己总结了两个方法.可以参考 https://blog ...
- 高并发分布式系统中生成全局唯一(订单号)Id js返回上一页并刷新、返回上一页、自动刷新页面 父页面操作嵌套iframe子页面的HTML标签元素 .net判断System.Data.DataRow中是否包含某列 .Net使用system.Security.Cryptography.RNGCryptoServiceProvider类与System.Random类生成随机数
高并发分布式系统中生成全局唯一(订单号)Id 1.GUID数据因毫无规律可言造成索引效率低下,影响了系统的性能,那么通过组合的方式,保留GUID的10个字节,用另6个字节表示GUID生成的时间(D ...
- js中子页面父页面方法 变量相互调用
(1)子页面调用父页面的方法或者变量: window.parent.方法()或者变量名window.parent相当于定位到父页面 之后的操作和在父页面中写代码一样写 window.parent.a ...
- js中子页面父页面方法和变量相互调用
(1)子页面调用父页面的方法或者变量: window.parent.方法()或者变量名window.parent相当于定位到父页面 之后的操作和在父页面中写代码一样写 window.parent.aa ...
- js中子页面父页面方法 变量相互调用(转)
原文:https://www.cnblogs.com/huangshuqiang/p/5734358.html (1)子页面调用父页面的方法或者变量: window.parent.方法()或者变量名w ...
- Vue组件通信之子传父
子组件向父组件通信主要通过自定义事件实现. 这里我记录一个小例子来帮助自己记忆. 通过点击子组件的按钮去执行父组件的函数并使用子组件传来的数据. 子组件定义如下: <template id=&q ...
- Django+ajax 返回json数据挨个显示在页面及页面和后台相互传值
通过Ajax传到后台一个值,根据该值返回数据库表中的某一列的值,然后逐个显示到页面,并且给每个加上超链接,可以进行点击查看详细信息 1.通过Ajax传到后台一个值,红色部分为往Django后台传值,蓝 ...
- Iframe父页面与子页面之间的调用
原文:Iframe父页面与子页面之间的调用 Iframe父页面与子页面之间的调用 专业词语解释如下: Iframe:iframe元素是文档中的文档. window对象: 浏览器会在其打 ...
随机推荐
- MSTM年底总结
项目简介 做完这个项目,自己也做了测试,功能是正常可以使用的,暂时还没有上线,这个项目是用来卖课的,我自己做的是各个种类课程的展示,登录认证,还有各个接口,还有支付环节,还有微信推送消息,加入他们要买 ...
- Python-数据类型之数字
一:数字类型概述 数字提供了标量存储和直接访问,属于不可变数据类型,所谓不可变,我们可以认为,更改数字的值会生成一个新的对象 # id可以唯一表示一个对象 age =18 print(id(age)) ...
- 步步为营-84-数字转化为金额的Js+enter键取消页面刷新
说明:来不及细说了,老铁快上车 function fmoney(s, n) { console.log(s); n = n > && n <= ? n : ; s = pa ...
- react-native 之gradle-2.x-all.zip 下载缓慢或失败
去官网http://www.gradle.org/downloadshttp://services.gradle.org/distributions下载匹配的 Gradle 版本把zip直接放到C:\ ...
- 在th中显示图片
从DataTable中获取值: foreach (DataRow dr in ((DataTable)ViewBag.bookInfoList).Rows) { <tr> <th c ...
- 【专栏学习】APM——异步编程模型(.NET不推荐)
(1)learning hard C#学习笔记 异步1:<learning hard C#学习笔记>读书笔记(20)异步编程 (2)<C# 4.0 图解教程> 22.4 异步编 ...
- snmp v3的安全配置 snmp认证与加密配置(53)
http://www.ttlsa.com/zabbix/snmp-v3-configuration/
- Windows Azure 搭建网络代理 Proxy
额 题目起的有点大 其实就是在 Linux 上使用代理 不过是用的 Azure 上的 Liunx 虚拟机而已 如何在 Azure 上搭建 VPN 见上篇:http://www.cnblogs.com/ ...
- Python_tuple部分功能介绍
x.count():元素在元组内的个数 x.index():元素在元组内的位置
- Codeforces 1092E Minimal Diameter Forest
Minimal Diameter Forest 首先我们找出每个连通块中的特殊点, 特殊点的定义是到各种个连通块中距离的最大值最小的点, 每个连通块肯定通过特殊点连到其他连通块, 我们把有最大值的特殊 ...