微信小程序(十六)slot插槽

注释很详细,直接上代码

上一篇

温馨提醒:此篇需要自定义组件的基础,如果不清楚请先看上一篇
新增内容:
1.单个插槽
2.多个插槽
单个插糟

源码:

myNav.wxml

<view class="navigationBar custom-class">
    <view class="navigationBarTitle title-class">
        自定义标题
        <slot></slot>//插槽位置
    </view>
</view>

index.wxml

<myNav custom-class="color-pink">
<text>🍉</text>
</myNav>

注意事项:没有注意事项

效果演示:

在这里插入图片描述

多个卡槽

多个卡槽需要提前声明一下

源码:

myNav.js

`myNav.js`
```js
Component({
    options:{
         multipleSlots:true//设置支持多个卡槽
    }
})

不同的插槽需要命名(自定义命名)

myNav.wxml

<view class="navigationBar custom-class">
    <view class="navigationBarTitle title-class">
        <slot name="left"></slot>
        自定义标题
        <slot name="right"></slot>
    </view>
</view>

index.wxml

<myNav custom-class="color-pink">
<text slot="left">🍉</text>
<text slot="right">🐼</text>
</myNav>

效果演示

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/349630.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【Unity3D日常开发】Unity3D中UGUI的Text、Dropdown输入特殊符号

推荐阅读 CSDN主页GitHub开源地址Unity3D插件分享简书地址我的个人博客 大家好&#xff0c;我是佛系工程师☆恬静的小魔龙☆&#xff0c;不定时更新Unity开发技巧&#xff0c;觉得有用记得一键三连哦。 一、前言 在开发中会遇到需要显示特殊符号的情况&#xff0c;比如上标、…

今天来看看工商业储能收益模式有哪些

安科瑞武陈燕acrelcy 2023 年有望成为工商业储能的发展元年&#xff0c;主要原因2023年工商业储能的经济性有望大幅提升。工商业储能下游主要为工商业企业&#xff0c;投资是否具有经济性是工商业需求的核心因素之一&#xff0c;而2023年工商业储能经济性或将显著提升&#xf…

conda-建立多个python环境

1. 安装 下载地址&#xff1a;Miniconda — miniconda documentation 2. 安装好了会自动配置环境变量&#xff0c;如果没有配置手动配置 3. 检查conda环境 4. 设置conda配置文件 在‪C:\Users\Administrator下新建文件【.condarc】 channels: //镜像地址- https://mirrors.…

Java中Integer(127)==Integer(127)为True,Integer(128)==Integer(128)却为False,这是为什么?

文章目录 1.前言2. 源码解析3.总结 1.前言 相信大家职业生涯中或多或少的碰到过Java比较变态的笔试题&#xff0c;下面这道题目大家应该不陌生&#xff1a; Integer i 127; Integer j 127;Integer m 128; Integer n 128;System.out.println(i j); // 输出为 true System.o…

4个值得推荐的WPF UI组件库

WPF介绍 WPF 是一个强大的桌面应用程序框架&#xff0c;用于构建具有丰富用户界面的 Windows 应用。它提供了灵活的布局、数据绑定、样式和模板、动画效果等功能&#xff0c;让开发者可以创建出吸引人且交互性强的应用程序。 HandyControl HandyControl是一套WPF控件库&…

社交媒体与新闻:Facebook在信息传播中的角色

社交媒体的崛起不仅改变了人们的日常交流方式&#xff0c;也对新闻传播产生了深远的影响。在众多社交媒体平台中&#xff0c;Facebook以其庞大的用户基础和强大的社交网络机制&#xff0c;成为信息传播的中流砥柱。本文将深入探讨Facebook在社交媒体与新闻传播的交汇点上扮演的…

C语言第九弹---二维数组

✨个人主页&#xff1a; 熬夜学编程的小林 &#x1f497;系列专栏&#xff1a; 【C语言详解】 【数据结构详解】 二维数组 1、二维数组的创建 1.1、二维数组的概念 ​1.2、⼆维数组的创建 2、二维数组的初始化 2.1、不完全初始化 ​2.2、完全初始化 ​2.3、按照行初始化 ​2.4、…

C++入门学习(十五)运算符

算术运算符&#xff1a;用于处理四则运算赋值运算符&#xff1a;用于将表达式的值赋给变量比较运算符&#xff1a;用于表达式的比较&#xff0c;并返回一个真值或假值逻辑运算符&#xff1a;用于根据表达式的值返回真值或假值 一、加减乘除 #include <iostream> #incl…

老师怎么发期末成绩才不会被投诉

众所周知&#xff0c;发布期末成绩是每位老师的必经之路&#xff0c;但也是诸多投诉的导火索。如何才能避免被投诉呢&#xff1f;且听我慢慢道来。 成绩不是老师的“独角戏”。它关乎学生一学期的努力&#xff0c;也关乎家长的期待。因此&#xff0c;成绩的发布需要充分考虑学…

java servlet果蔬产业监管系统Myeclipse开发mysql数据库web结构java编程计算机网页项目

一、源码特点 java Web果蔬产业监管系统是一套完善的java web信息管理系统 serlvetdaobean mvc 模式开发 &#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主 要采用B/S模式开发。开发环境为TOMCAT7.0,Myeclipse8.5…

Cesium事件处理

文章目录 0.引言1.鼠标事件1.1鼠标左键事件1.2鼠标右键事件1.3鼠标移动事件1.4鼠标滚轮事件 2.键盘事件3.相机事件4.场景渲染事件 0.引言 无论是二维GIS应用系统还是三维GIS应用系统&#xff0c;都离不开各种事件的应用&#xff0c;特别是鼠标左键单击事件、鼠标左键双击事件等…

python-自动化篇-运维-监控-简单实例-道出如何使⽤Python进⾏系统监控?

如何使⽤Python进⾏系统监控&#xff1f; 使⽤Python进⾏系统监控涉及以下⼀般步骤&#xff1a; 选择监控指标&#xff1a; ⾸先&#xff0c;确定希望监控的系统指标&#xff0c;这可以包括 CPU 利⽤率、内存使⽤情况、磁盘空间、⽹络流量、服务可⽤性等。选择监控⼯具&#x…

Spirngboot3+Vue3-0125

Spirngboot3Vue3-0125 扫描配置文件 Value ConfigurationProperties(prefix "email") 扫描bean ComponentScan bean注册 -三方的bean Bean注册bean Bean("自定义名称") Import 设置bean注册的条件 Conditional -自己的bean Repository Service Controlle…

全桥变压器计算2

1 根据输入最高电压与磁通密度计算出来原边的圈数 2 根据输入输入电压计算出来原副边圈数 3 输入功率计算 4 根据输入功率计算DC输出的平均值,有效值,峰值电流 5根据副边电感感量,然后写出励磁电感的表达式 6 根据写出理想变压器原边绕组电流表达式<

中级ccnp多久可以考下来?ccnp 课件哪里有?

思科中级CCNP考试要求考生具备一定的网络基础知识&#xff0c;包括IP地址规划、VLAN配置、STP协议等。然而&#xff0c;对于许多初学者来说&#xff0c;中级CCNP考试的难度和门槛都是一个不小的挑战。那么&#xff0c;究竟需要多久才能考下中级CCNP证书呢?下面将为你详细解读。…

CodeGPT

GitCode - 开发者的代码家园 gitcode.com/ inscode.csdn.net/liujiaping/java_1706242128563/edit?openFileMain.java&editTypelite marketplace.visualstudio.com/items?itemNameCSDN.csdn-codegpt&spm1018.2226.3001.9836&extra%5Butm_source%5Dvip_chatgpt_c…

SIP UPDATE method

UPDATE 在RFC3311中定义。 UPDATE 允许客户端更新session的参数&#xff0c;例如媒体流集及其codec&#xff0c;但对dialog的状态没有影响。从这个意义上说&#xff0c;它就像re-INVITE&#xff0c;但与re-INVITE不同&#xff0c;因为UPDATE是在intial INVITE完成之前发送(MT发…

锂电池升6V输出3A芯片。2.7v-5.5v输入,输出6v给马达供电

锂电池升压输出芯片是一种常见的电子元件&#xff0c;广泛应用于各种电子设备中。本文将介绍一款锂电池升压输出芯片&#xff0c;AH8681可以将2.7V-5.5V的输入电压升压至6V&#xff0c;电流可达3A&#xff0c;内置MOS管。 该锂电池升压输出芯片具有以下特点&#xff1a; 1. 输…

代理模式-C#实现

该实例基于WPF实现&#xff0c;直接上代码&#xff0c;下面为三层架构的代码。 目录 一 Model 二 View 三 ViewModel 一 Model using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks;namespace 设计模式练…

技术必备:推荐一款超强接口管理神器 Apifox

去年&#xff0c;给大家推荐了一款新面市不久的接口测试神器&#xff1a;Apifox&#xff0c;最近一年&#xff0c;Apifox官方又发布了一些新特性&#xff0c;趁此机会&#xff0c;再给大家分享一波。 简单来说&#xff0c;Apifox它是集&#xff1a;接口文档管理、接口调试、Mo…