抽离的子组件
<template>
<div class="wrapper">
<slot name="demo" :msg="msg" text="this is a slot demo , ">this is demo slot.</slot>
</div>
</template> <script>
export default {
components: {},
props: {},
data() {
return {
msg: 'nmb'
}
},
watch: {},
computed: {},
methods: {},
created() {},
mounted() {}
}
</script>
<style lang="scss" scoped>
.wrapper {
}
</style>

  

某组件内使用抽离组件
<father>
<template v-slot:demo="scope">
sb
<p>{{ scope.text }}{{ scope.msg }}</p>
</template>
</father>

  

v-slot vue2.6新增指令使用指南的更多相关文章

  1. vue2.0自定义指令

    前面一片文章说了vue2.0过滤器,其实自定义指令跟过滤器非常相似,单就定义方式而言,其与过滤器完全一致,分为局部指令,和全局指令.不过就是filter改为directive的区别. 过滤器一般用于对 ...

  2. Vue2.0原理-指令

    指令是 模板解析 的续章,本文会尝试从源码的角度来理解 指令 是如何被提取和应用的. 指令的提取 指令的提取过程是在parse阶段进行的,在 parseHTML 方法中,会解析字符串模板为如下的单个a ...

  3. vue2.0 自定义指令详解

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. vue2.0 v-model指令

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. 17. Vue2.4+新增属性$listeners

    现在我们来讨论一种情况,A组件与C组件怎么通信,我们有多少种解决方案? 我们使用VueX来进行数据管理,但是如果项目中多个组件共享状态比较少,项目比较小,并且全局状态比较少,那使用VueX来实现该功能 ...

  6. vue2.0自定义指令的使用方法

    感觉2.0好坑啊,自定义指令和1.0完全不一样,并且文档写得也不太清晰,下面是我写得一个demo,希望帮助大家更好地理解自定义指令 <!DOCTYPE html> <html lan ...

  7. Vue2.0 - 自定义指令 vue-directive

    Vue.directive('指令',function(el,binding,vnode){ el.style='color:'+binding.value;}); el : 指令所绑定的元素,可以用 ...

  8. vue2.X v-model 指令

    1.v-model指令 <!DOCTYPE html> <html> <head> <title></title> <script s ...

  9. vue2.0 自定义指令

    Vue指令 Vue的指令以v-开头,作用在HTML元素上,将指令绑定在元素上,给绑定的元素添加一些特殊行为. 例如: <h1 v-if="yes">Yes</h1 ...

随机推荐

  1. C++中继承的protected访问级别

    1,子类是否可以直接访问父类的私有成员? 2,根据面向对象理论: 根据 C++ 语法: 3,继承中的访问级别编程实验: #include <iostream> #include <s ...

  2. 点击td对同行的其他td进行操作

    假设有这样的一段tr: <tr> <td><input type="checkbox" name="item" class=&qu ...

  3. Flask+elasticsearch实现搜索引擎入门教程+Curl调试

    前几天,在github上看到了一个关于elasticsearch的小项目,有点小兴趣,于是就结合着Flask,研究了一下,分享给大家. 准备资料: 1.安装elasticsearch 参考教程:htt ...

  4. JS中有趣的知识

    1.分号与换行 function fn1(){ return { name: 'javascript' }; } function fn2(){ return { name: 'javascript' ...

  5. 创建Uboot 环境变量 bin 文件

    As we know, the bootloader stores its configuration into an area of the flash called the environment ...

  6. Ubuntu命令行操作

    一.文件/文件夹管理 ls 列出当前目录文件(不包括隐含文件) ls -a 列出当前目录文件(包括隐含文件) ls -l 列出当前目录下文件的详细信息 cd .. 回当前目录的上一级目录 cd - 回 ...

  7. Codeforces 1190C Tokitsukaze and Duel game

    题意:有一个长为n的01串,两个人轮流操作,每个人可以把某个长度为m的区间变成相同颜色,谁在操作后整个串颜色相同就赢了.问最后是谁赢?(有可能平局) 思路:容易发现,如果第一个人不能一击必胜,那么他就 ...

  8. cglib代理与jdk动态代理示例

    先看基于jdk实现的动态代理实现例子 1.先声明一个接口类 public interface UserService{ public String getName(String msg); } 2.实 ...

  9. 常用的外网yum源之epel.repo

    [epel]name=Extra Packages for Enterprise Linux 6 - $basearchbaseurl=http://download.fedoraproject.or ...

  10. ubuntu Oracle SQL Developer 安装

    一. 官网下载oracle 安装包 二.下载完毕后,检查你的Ubuntu是否安装了tar和alien sudo apt-get install tar sudo apt-get install ali ...