刚开始看这个slot的时候有点蒙，想了几分钟才明白过来，汗颜

<script>

  var mycompoent = Vue.extend({

    template:"<div><h2>子组件标题</h2><slot>如果有内容不显示这句话</slot></div>"

})

new Vue({

 el:"#app",

components:{

   "mycomponent":mycompoent

  }

})

</script>
<body>

  <div id="app">

        <h1>父组件标题</h1>

<mycomponent>

   <p>因为有p标签元素，所以slot里面的内容不会显示，可以试试把p标签不要试试</p>

</mycomponent>

  </div>

</body>

vue.js单个slot的更多相关文章

  1. vue.js 中slot 用处大（转载）

    什么是组件? 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊功能.在有 ...

  2. 关于vue.js中slot的理解

    slot这块看官网文档,起初有点不懂,仔细研究还是最终理解了,slot是用来干嘛的呢,先看下一个例子: <script src="https://unpkg.com/vue/dist/ ...

  3. vue.js的<slot>

    使用插槽分发内容在封装vue组件的时候,很多时候就不得不使用到vue的一个内置组件<slot>.slot是插槽的意思,顾名思义,这个<slot>组件的意义是预留一个区域,让其中 ...

  4. Vue.js插槽slot和作用域插槽slot-scope学习小结

    一般来说,在Vue项目中使用父子组建时,都是把通用的HTML结构提取出来写成一个子组件,需要动态展示的数据用过prop属性传递,不过有时候我们可能想给子组件传递一个HTML代码,这个时候用prop不太 ...

  5. Vue.js 作用域、slot用法（单个slot、具名slot）

    作用域 在介绍slot前,需要先知道一个概念:编译的作用域.比如父组件中有如下模板: <child-component> {{message}} <child-component&g ...

  6. vue.js之数据传递和数据分发slot

    一.组件间的数据传递 1.父组件获取子组件的数据 *子组件把自己的数据,发送到父级 *vm.$emit(事件名,数据); *v-on: @ 示例用法:当点击send按钮的时候,"111&qu ...

  7. vue.js中的slot

    vue.js 中的 slot 一.slot 的作用 调用组件的时候,对于数据,我们会用props将数据从父组件传至子组件.但是,如果从父组件到子组件,单纯是页面局部渲染的改变,slot会更合适. 二. ...

  8. Vue.js 组件的三个 API：prop、event、slot

    组件的构成 一个再复杂的组件,都是由三部分组成的:prop.event.slot,它们构成了 Vue.js 组件的 API.如果你开发的是一个通用组件,那一定要事先设计好这三部分,因为组件一旦发布,后 ...

  9. Vue.js——60分钟组件快速入门（下篇）

    概述 上一篇我们重点介绍了组件的创建.注册和使用,熟练这几个步骤将有助于深入组件的开发.另外,在子组件中定义props,可以让父组件的数据传递下来,这就好比子组件告诉父组件:"嘿,老哥,我开 ...

随机推荐

  1. The superclass "javax.servlet.http.HttpServlet" was not found on the Java Build Path(Myeclipse添加Server Library)

    网上找练习的项目导入到myeclipse项目发现每个JSP 出现错误The superclass "javax.servlet.http.HttpServlet" was not ...

  2. LVS和nginx反向代理网站架构

    LVS和nginx反向代理网站架构 nginx反向代理和lvs的dr都存在单点,要keepalived做高可用,但是成本高了 f

  3. PID参数调整的口诀

    PID参数调整的口诀:参数整定找最佳,从小到大顺序查先是比例后积分,最后再把微分加曲线振荡很频繁,比例度盘要放大曲线漂浮绕大湾,比例度盘往小扳曲线偏离回复慢,积分时间往下降曲线波动周期长,积分时间再加 ...

  4. 有关ros::spin()和ros::spinonce()若干感受

    ros::spinonce()一般与loop_rate.sleep()同时出现,用来控制处理回调函数的频率,并且没有消息就收来时,就会程序堵塞,不会占用CPU资源. ros::spin(),用于回调函 ...

  5. python16_day36【爬虫1】

    一.requests 1. GET请求 # 1.无参数实例 import requests ret = requests.get('https://github.com/timeline.json') ...

  6. SQL面试题及答案

    我觉得里面有些答案是不正确的,请只作参考 Student(S#,Sname,Sage,Ssex) 学生表       S#:学号:Sname:学生姓名:Sage:学生年龄:Ssex:学生性别 Cour ...

  7. 52. N-Queens II(数个数)

    The n-queens puzzle is the problem of placing n queens on an n×n chessboard such that no two queens ...

  8. Ubuntu 系统下暴力卸载 MySQL

    一.概述 MySQL 出问题了,正常的 start.stop 不起作用. apt-get remove mysql-server apt-get remove mysql-client 上面这些命令不 ...

  9. VS2010/MFC编程入门之二十二（常用控件：按钮控件Button、Radio Button和Check Box）

    言归正传,鸡啄米上一节中讲了编辑框的用法,本节继续讲解常用控件--按钮控件的使用. 按钮控件简介 按钮控件包括命令按钮(Button).单选按钮(Radio Button)和复选框(Check Box ...

  10. BZOJ：3832: [Poi2014]Rally

    题意: 给出$DAG$,询问删掉哪个点之后最长路径最短 思路: 我们令$f[x]$表示从最远的点到达它的距离,$g[x]$表示它能够到达最远的点的距离 那么对于$(x -> y)$一条边来说,它 ...