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对象: 浏览器会在其打 ...
随机推荐
- nodejs 环境安装
参考网站 http://www.runoob.com/nodejs/nodejs-http-server.html https://github.com/nodesource/distribution ...
- 20165323 实验一 Java开发环境的熟悉
一.实验报告封面 课程:Java程序设计 班级:1653班 姓名:杨金川 学号:20165323 指导教师:娄嘉鹏 实验日期:2018年4月2日 实验时间:13:45 - 15:25 实验序号:一 实 ...
- ORA-01536: 超出表空间 'tablespace_name' 的空间限额
表空间限额问题知识总结: 表空间的大小与用户的配额大小是两种不同的概念 表空间的大小是指实际的用户表空间的大小,而配额大小指的是用户指定使用表空间的的大小 把表空间文件增大,还是出现 ...
- Windows 7下java SDK下载、安装及环境变量设置
第一步:下载Java JDK 1 登录官网站下载正版JDK 2 点击"SDK Download"进入Java JDK下载页面 注明: Java JDK和Java JRE区别 ...
- 自定义rem
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 开源CMS系统Moodle对比中国本土化开源在线教育平台EduSoho
这段时间研究了一下著名的开源课程管理系统Moodle,也了解了一下目前国内比较火的在线教育平台EduSoho,发现二者有诸多相似之处,但优势各异.接下来就简单对着两个平台做一下对比. 首先来说一下Ed ...
- MaterialEditText——Android Material Design EditText控件
MaterialEditText是Android Material Design EditText控件.可以定制浮动标签.主要颜色.默认的错误颜色等. 随着 Material Design 的到来, ...
- 【Arduino】开发入门【十】Arduino蓝牙模块与Android实现通信
[Arduino]开发入门[十]蓝牙模块 首先show一下新入手的蓝牙模块 蓝牙参数特点 1.蓝牙核心模块使用HC-06从模块,引出接口包括VCC,GND,TXD,RXD,预留LED状态输出脚,单片机 ...
- django引入现有数据库 转
django引入现有数据库 Django引入外部数据库还是比较方便的,步骤如下: 1.创建一个项目,修改seting文件,在setting里面设置你要连接的数据库类型和连接名称,地址之类,和创建新 ...
- angularjs 中通过 $location 进行路由跳转传参
$location.path('/page1').search({id: $scope.id,name:$scope.name}); 带参数跳转页面,在新的页面通过$routeParams接收参数 $ ...