微信小程序基础知识--条件渲染 ,样式模板引入

文章探讨了在前端开发中如何优化条件渲染以提高效率,通过数据分类绑定减少不必要的数据加载。同时,提出将相同样式做成模板的方法,以实现代码复用,降低维护成本。介绍了两种引入模板的方式,并提到了将样式放入公共模板以统一管理。
摘要由CSDN通过智能技术生成

一、条件渲染

1.1  isgood

用isgood  数值满足某个条件就执行

 一个数据绑定两个不同的区域块

 

1.2 轮播图条件渲染

 

1.3列表条件绑定 

1.4 block

 

以上均把全部的数据都加载了,影响效率问题

下面解决效率问题

二、数据分类绑定 

从服务器中获取到的数据

  for 循环 

将满足条件的分类到两个数组

 

 将两个数组使用this 进行数组的赋值

swiper

food

 ARR1  swiper

ARR2   food

三、列表模拟数据绑定

 首页和详情页有相同样式,改一个其他地方也要改

是否可以制作以一个模板,运用于多个相同样式的页面

五、相同样式做成一个模板

5.1  

 page下新建公共模板templete

WXML  结构

WXSS   样式

两个文件名称一样

   name给样式模块定义一个名称

在建立的WXML模板之下,

(引入模板第一种方法)

list

如何在其他地方引入样式模板

WXML

src指定模板的引入路径

is属性填写模板的名称

data传递给模板的数据

list

 (引入模板  第二种方法)

 

引入模板样式

模板样式和样式一样(第三种)

 

引入样式文件

把样式放在公共样式模板

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值