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 的使用的更多相关文章

  1. RDIFramework.NET ━ .NET快速信息化系统开发框架 ━ 工作流程组件Web业务平台

    RDIFramework.NET ━ .NET快速信息化系统开发框架  工作流程组件Web业务平台 接前两篇: RDIFramework.NET ━ .NET快速信息化系统开发框架 ━ 工作流程组件介 ...

  2. RDIFramework.NET ━ .NET快速信息化系统开发框架 ━ 工作流程组件WinForm业务平台

    RDIFramework.NET ━ .NET快速信息化系统开发框架 工作流程组件WinForm业务平台 接上篇: RDIFramework.NET ━ .NET快速信息化系统开发框架 ━ 工作流程组 ...

  3. 基于 SOA 的组件化业务基础平台

    业务基础平台是业务逻辑应用和基础架构平台之间的一个中间层,解决 “应用软件的业务描述和操作系统平台.软件基础架构平台之间的交互与管理问题”.操作系统平台解决了“应用软件系统与硬件之间的交互与管理问题” ...

  4. surging如何使用swagger 组件测试业务模块

    1.前言 微服务架构概念的提出已经有非常长一段时间了,但在近期几年却开始频繁地出现,大家都着手升级成微服务架构,使用着各种技术,大家认为框架有服务治理就是微服务,实现单一协议的服务调用,微服务虽然没有 ...

  5. 基于SOA的组件化业务基础平台[转]

    转自https://www.ibm.com/developerworks/cn/webservices/1111_xiaojg_soa/index.html 业务基础平台是业务逻辑和基础架构平台之间的 ...

  6. RDIFramework.NET敏捷开发框架 ━ 工作流程组件Web业务平台

    接前两篇: RDIFramework.NET敏捷开发框架 ━ 工作流程组件介绍 RDIFramework.NET敏捷开发框架 ━ 工作流程组件WinForm业务平台 1.RDIFramework.NE ...

  7. vue组件4 利用slot将内容传递给组件

    除了将数据作为prop传入到组件中,vue也允许传入HTML 父组件中的子组件:<custom-button>点我<custom-button/> custom-button子 ...

  8. 三、深入Vue组件——Vue插槽slot、动态组件

    一.插槽slot() 1.1简单插槽slot [功能]用于从父组件中,通过子组件写成双标签,向子组件中放入自定的内容 parent.vue [1]首先把child写成双标签样式,把要插入的内容放双标签 ...

  9. 微信小程序创建组件的流程,以及组件 properties 和 slot

    组件定义流程 1)为了方便管理组件文件,创建一个目录来存放组件(可省略该步骤) 组件与页面都有相同的配置,包括的文件有:wxml.wxss.js.json 四个文件. 2)编写组件 编写组件与编写页面 ...

随机推荐

  1. sql -- 多表关联,update(用户奖励)

    表设计: users_buy: users_score: 需求: 1.根据用户分组,找出用户消费最高的金额 select user_name, max(paymoney) as pm from use ...

  2. JSR310-新日期APIJSR310新日期API(完结篇)-生产实战

    前提 前面通过五篇文章基本介绍完JSR-310常用的日期时间API以及一些工具类,这篇博文主要说说笔者在生产实战中使用JSR-310日期时间API的一些经验. 系列文章: JSR310新日期API(一 ...

  3. SVG 新手入门

    svg 入门新认知 一.第一步创建设置svg <svg width="100%" height="500"> </svg> 设置粗细 5 ...

  4. 原生js写一个无缝轮播图插件(支持vue)

    轮播图插件(Broadcast.js) 前言:写这个插件的原因 前段时间准备用vue加上网易云的nodejs接口,模拟网易云音乐移动端.因为想自己写一遍所有的代码以及加固自己的flex布局,所以没有使 ...

  5. Windows安装python包出现PermissionError: [WinError 32] 另一个程序正在使用此文件,进程无法访问的问题解决方案

    在python中安装sqlalchemy时,总是提示(当安装依赖有vs的python包时,可能会出现以下错误:) PermissionError: [WinError 32] 另一个程序正在使用此文件 ...

  6. koa进阶史(一)

    1,设置静态文件目录,将__dirname 写成_dirname,乍看没什么毛病,但是一运行之后发现,_dirname is not defined,下次注意哈 app.use(express.sta ...

  7. Head First设计模式——生成器和责任链模式

    生成器 生成器模式:封装一个产品的构造过程,并允许按步骤构造. 现又一个度假计划指定,需要指定度假每一天的活动.旅馆.用餐.门票等等事情,但是每个客人的度假计划可能不太一样.例如天数.活动类型.用餐等 ...

  8. JAVA校内赛

    第一题: 问题描述 在计算机存储中,15.125GB是多少MB?答案提交 这是一道结果填空的题,你只需要算出结果后提交即可.本题的结果为一个整数,在提交答案时只填写这个整数,填写多余的内容将无法得分. ...

  9. Flask 使用pycharm 创建项目,一个简单的web 搭建

    1:新建项目后 2:Flask web 项目重要的就是app 所有每个都需要app app=Flask(__name__)   3:Flask 的路径是有app.route('path')装饰决定, ...

  10. go入门二

    一.流程控制 1.选择结构 if-else: package main import ( "io/ioutil" "fmt" ) func main(){ co ...