文档章节

作用域slot

 金于虎
发布于 06/22 15:22
字数 227
阅读 7
收藏 0

如果父组件需要使用子组件中的内容怎么办,比如父组件需要控制子组件的显示

	<div id="root">
		<child><template slot-scope="props">
			
			<h1>{{props.item}} <div>编辑</div></h1>
		</template></child>
	</div>
    <script type="text/javascript">
    	Vue.component('child',{

    		data:function(){
    			return {
    				list:[1,2,3,4]
    			}
                
    		},
    		props:['content'],
    		template: `<div>
    		  <ul>  <slot v-for="item of  list" :item=item></slot></ul>
    		     </div>
    		   `
    	})

    	new Vue({
    		el:'#root'
    	})
    </script>

我们在父组件中拿到了 子组件的数据,slot-scope接受所有传递过来的数据

作用域插槽

1. 作用域插槽必须是一个template开头和结尾的内容
2. 声明子组件需要接受的数据都在放在那props-slot
3. 告诉子组件接受的模板信息(应该怎么展示)

© 著作权归作者所有

共有 人打赏支持
粉丝 1
博文 105
码字总数 42695
作品 0
曲靖
加载中

评论(1)

金于虎
http://www.mescroll.com/api.html
Vue组件三-Slot分发内容

Vue组件三-Slot分发内容 开始 Vue组件是学习Vue框架最比较难的部分,而这部分难点我认为可以分为三个部分学习,即 组件的传值 - 父组件向子组件中传值 事件回馈 - 子组件向父组件发送消息,父...

mdiep
05/13
0
0
Vue作用域插槽 :slot-scope 实例

昨天看vue的官网文档,在slot-scope这块不是特别的明白,今天自己做了一个小例子,便于理解。 先说一下我们假设的应用常用场景,我们已经开发了一个代办事项列表的组件,很多模块在用,现在要...

愚坤
09/04
0
0
深入理解java虚拟机-运行时栈帧结构

栈帧是什么? 用于支持虚拟机进行方法调用和方法执行的数据结构. 栈帧都存储了些什么东东? 每一个栈帧都包括方法的局部变量表,操作栈,动态连接和方法返回地址和一些附加信息等. 线程,栈帧,方法...

sonysce
2014/02/26
0
0
[虚拟机字节码执行引擎] 1 - 栈桢

本文主要内容 前言 运行时栈桢结构 已经学习了虚拟机内存区域、Class文件结构、类加载机制等知识,是时候学习虚拟机字节码执行过程了。 前言 虚拟机是一个相对物理机而言的概念,它们都有代码...

某昆
01/06
0
0
《深入理解Java虚拟机》之执行引擎栈针(8)

一. 运行时栈帧结构 1. 栈帧是用于支持虚拟机进行方法调用和方法执行的数据结构,它是虚拟机运行时数据区中的虚拟机栈的元素。栈帧存储了方法的局部变量,操作数栈,动态链接,方法返回地址...

lixiyuan
2014/04/12
105
0

没有更多内容

加载失败,请刷新页面

加载更多

【mpvue】三

使用了快1个月,陆续整理发现的坑 1、pageA-pageB-pageA-pageC 如果以这种顺序,大概理解成,列表进详情B, 返回列表进入详情C,那么进入详情C的时候,会因为缓存,先展现详情B的内容。解决方...

登天的感觉
21分钟前
1
0
在EXCEL指定SHEET页,指定文字位置,插入批注

Java操作EXCEL文件,利用POI,在EXCEL指定SHEET页中指定文字位置处插入批注 package excel; import java.io.FileInputStream; import java.io.FileOutputStream; import org.apache.poi.hssf......

zhaochaochao
23分钟前
1
0
一些网站。

UI schema,可以用json定义UI表单:https://jsonforms.io/examples/array

王坤charlie
29分钟前
1
0
百万连接,百亿吞吐量服务的JVM性能调优实战

转载占小狼博客 应用:shark-新美大移动端网络优化(每日接受移动端请求约150亿) 应用特点 : qps比较高,新生代增长飞快 用户的连接需要维持一段时间 单机需要维持海量连接,几十万的级别 以...

BakerZhu
33分钟前
1
0
iOS涂色涂鸦效果、Swift仿喜马拉雅FM、抽屉转场动画、拖拽头像、标签选择器等源码

iOS精选源码 LeeTagView 标签选择控件 为您的用户显示界面添加美观的加载视图 Swift4: 可拖动头像,增加物理属性 Swift版抽屉效果,自定义转场动画管理器 Swift 仿写喜马拉雅FM 可能是最好用...

sunnyaigd
33分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部