1.插槽slot基本使用「建议收藏」

1.插槽slot基本使用「建议收藏」<body><divid="app"><cpn></cpn><cpn><bstyle="c

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

<body>
    <div id="app">
        <cpn> </cpn>
        <cpn> <b style="color: red;"> 火星情报局 </b> </cpn>
        <cpn> <em style="font-size: 12px;"> 我是斜体 </em> </cpn>
    </div>
    <template id="cpn">
        <div>
            <h3>我是标题</h3>
            <p>好好学习,天天向上</p>
            <slot><button>下一步</button></slot>
            <!-- 1.插槽:如果有多个相同的组件 里面有些东西不需要同步  可以预留插槽 slot 
            在需要预留的地方 写 slot标签  然后在 使用子组件的时候 把不同的内容 放进去        
            2. 插槽默认值 <slot> <button></button> </slot>
            3.如果有多个值 同时放入组件进行替换时,会一起被作为替换元素
        -->
        </div>
    </template>
    <script src='https://cdn.jsdelivr.net/npm/vue@2.6.12/dist/vue.js'></script>
    <script>
        const cpn = {
            template: "#cpn",
        }
        const app = new Vue({
            el: '#app',
            data: {

            },
            components: {
                cpn,
            }
        })
    </script>
</body>

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/166914.html原文链接:https://javaforall.net

(0)
上一篇 2022年8月1日 下午7:16
下一篇 2022年8月1日 下午7:36


相关推荐

  • Mechanize模拟浏览器

    Mechanize模拟浏览器简介 Mechanize 是一个 Python 模块 用于模拟浏览器 该模块能够处理网页登录所要求的用户名 密码 验证码 该模块的具体用法如下使用方法一 importmechan 导入模块 br mechanize Browser br set handle equiv True br set handle redirect True br set handle referer T

    2026年3月20日
    2
  • vue的双向绑定原理及实现_vue双向绑定指令

    vue的双向绑定原理及实现_vue双向绑定指令vue双向绑定原理及实现一、MVC模式二、MVVM模式三、双向绑定原理1、实现一个Observer2、实现一个Watcher3、实现一个Compile4、实现一个MVVM四、最后写一个html测试一下我们的功能一、MVC模式MVC模式以往的MVC模式是单向绑定,即Model绑定到View,当我们用JavaScript代码更新Model时,View就会自动更新二、MVVM模式MVVM模式就是Model–View–ViewModel模式。它实现了View的变动,自动反映在ViewModel,反之亦然

    2022年10月10日
    5
  • 云容笔谈·东方红颜影像生成系统与智能体(Agent)协同工作流设计

    云容笔谈·东方红颜影像生成系统与智能体(Agent)协同工作流设计

    2026年3月16日
    2
  • python之random库

    random库是用于产生并运用随机数的标准库1.random库函数(1)random.seed(a)设置随机种子数,可以是浮点数或整数,如果不设置的话,则random库默认以系统时间产生当作随

    2021年12月29日
    60
  • awk linux 数组,Linux中的awk数组的基本使用方法

    awk linux 数组,Linux中的awk数组的基本使用方法1.awk数组描述在其他的编程语言中,数组的下标都是从0开始的,也就是说,如果想反向引用数组中的第一个元素,则需要引用对应的下标[0],在awk中数组也是通过引用下标的方法,但是在awk中数组的下标是从1开始的,在其他语言中,你可能会习惯于先“声明”一个数组,在awk中,则不用这样,直接为数组的元素赋值即可(其实如果自己给数组赋值,下标从1或者从0开始那就无所谓了!)2.在声明数组时,可能值很多…

    2022年7月19日
    19
  • ansi utf-8编码_utf8是等长编码吗

    ansi utf-8编码_utf8是等长编码吗原文地址:http://www.yanwushu.com/post/4.html1.ANSI指AmericanNationalStandardsInstitute(美国国家标准学会)。2.ANSI编码不是一种具体的编码方式,而是一种指定在某些环境下使用某些编码方式的标准。比如,在中文环境中ANSI的编码标准为GBK,在日语环境中ANSI的编码标准则是Shi

    2026年2月22日
    5

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号