WeChat-SmallProgram:组件的业务 slot 的使用
1、调用组件向自定义组件插入内容,使用 slot 在自定义模板中有一对
<view><slot></slot></view>
这里是干什么用的呢? 在组件模板中可以提供一个 <slot> 节点,用于承载组件引用时提供的子节点。
在 components 创建组件 , 点击 components 自动创建好所需文件
在 .wxml 文件中输入
<view>
<slot></slot>
</view>

2 、json 文件 开启 : component: true 开启组件使用

3 、如果启用多slot支持 ,在js中引入
options: {
multipleSlots: true // 在组件定义时的选项中启用多slot支持
},

4. 组件完毕, 视图引入组件 , pages 文件中的属于视图 比如:pages文件中的 detail 文件引用组件,为父组件
4.1、先在父组件 . json 中 引入 子组件的路径

4.2、在 wxml 使用 , 我定义的 子组件 名为 c-ping
如图使用: <c-ping><text> 这里写内容 </text></c-ping>

4.3、视图就会显示出来内容,如果没有 slot ,视图就不显示内容
You have to work hard to look effortless
You're going to sneak up and surprise everyone
原文引用:https://blog.csdn.net/qq_42767631/article/details/84971139
WeChat-SmallProgram:组件的业务 slot 的使用的更多相关文章
- RDIFramework.NET ━ .NET快速信息化系统开发框架 ━ 工作流程组件Web业务平台
RDIFramework.NET ━ .NET快速信息化系统开发框架 工作流程组件Web业务平台 接前两篇: RDIFramework.NET ━ .NET快速信息化系统开发框架 ━ 工作流程组件介 ...
- RDIFramework.NET ━ .NET快速信息化系统开发框架 ━ 工作流程组件WinForm业务平台
RDIFramework.NET ━ .NET快速信息化系统开发框架 工作流程组件WinForm业务平台 接上篇: RDIFramework.NET ━ .NET快速信息化系统开发框架 ━ 工作流程组 ...
- 基于 SOA 的组件化业务基础平台
业务基础平台是业务逻辑应用和基础架构平台之间的一个中间层,解决 “应用软件的业务描述和操作系统平台.软件基础架构平台之间的交互与管理问题”.操作系统平台解决了“应用软件系统与硬件之间的交互与管理问题” ...
- surging如何使用swagger 组件测试业务模块
1.前言 微服务架构概念的提出已经有非常长一段时间了,但在近期几年却开始频繁地出现,大家都着手升级成微服务架构,使用着各种技术,大家认为框架有服务治理就是微服务,实现单一协议的服务调用,微服务虽然没有 ...
- 基于SOA的组件化业务基础平台[转]
转自https://www.ibm.com/developerworks/cn/webservices/1111_xiaojg_soa/index.html 业务基础平台是业务逻辑和基础架构平台之间的 ...
- RDIFramework.NET敏捷开发框架 ━ 工作流程组件Web业务平台
接前两篇: RDIFramework.NET敏捷开发框架 ━ 工作流程组件介绍 RDIFramework.NET敏捷开发框架 ━ 工作流程组件WinForm业务平台 1.RDIFramework.NE ...
- vue组件4 利用slot将内容传递给组件
除了将数据作为prop传入到组件中,vue也允许传入HTML 父组件中的子组件:<custom-button>点我<custom-button/> custom-button子 ...
- 三、深入Vue组件——Vue插槽slot、动态组件
一.插槽slot() 1.1简单插槽slot [功能]用于从父组件中,通过子组件写成双标签,向子组件中放入自定的内容 parent.vue [1]首先把child写成双标签样式,把要插入的内容放双标签 ...
- 微信小程序创建组件的流程,以及组件 properties 和 slot
组件定义流程 1)为了方便管理组件文件,创建一个目录来存放组件(可省略该步骤) 组件与页面都有相同的配置,包括的文件有:wxml.wxss.js.json 四个文件. 2)编写组件 编写组件与编写页面 ...
随机推荐
- CF 1305E. Kuroni and the Score Distribution
题目大意:题目给定两个数n和m(1<=n<=5000,0<=m<=1e9)要求构造一个数列A,A中元素 大于等于1,小于等于1e9且满足严格递增 满足ai+aj=ak的(i,j ...
- 使用QT绘制一个多边形
目录 1. 概述 2. 实现 2.1. 代码 2.2. 解析 3. 结果 1. 概述 可以通过QT的重绘事件和鼠标事件来绘制多边形,最简单的办法就是在继承QWidget的窗体中重写paintEvent ...
- 前端每日实战:48# 视频演示如何用纯 CSS 创作一盘传统蚊香
效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/BVpvMz 可交互视频教程 此视频 ...
- Go coding in go way(用Go的思维去coding)
本文是Tony Bai在2017年第三届GopherChina大会上所作,来源如下 https://tonybai.com/2017/04/20/go-coding-in-go-way/ 一.序 今天 ...
- 今夜我懂了Lambda表达式_解析
现在时间午夜十一点~ 此刻的我血脉喷张,异常兴奋:因为专注得学习了一把java,在深入集合的过程中发现好多套路配合Lambda表达式真的是搜椅子,so开了个分支,决定从"只认得", ...
- 如何将zTree选中节点传递给后台
获取zTree选中节点 <body> <script type="text/javascript"> var setting = { view: { dbl ...
- Matplotlib数据可视化(6):饼图与箱线图
In [1]: from matplotlib import pyplot as plt import numpy as np import matplotlib as mpl mpl.rcParam ...
- linux-TFTP服务
1.TFTP协议简介TFTP,全称是 Trivial File Transfer Protocol(简单文件传输协议),基于 UDP 实现,该协议简单到只能从远程服务器读取数据或向远程服务器上传数据. ...
- js中的堆和栈
http://www.jscwwd.com/article/5e533ae2552a8e2bf45d3d69 这里先说两个概念:1.堆(heap)2.栈(stack)堆 是堆内存的简称.栈 是栈内存的 ...
- PostgreSQL查询表以及字段的备注
目录 查询所有表名称以及字段含义 查看所有表名 查看表名和备注 查看特定表名备注 查看特定表名字段 查询所有表名称以及字段含义 select c.relname 表名,cast(obj_descrip ...