小程序的基础加强

2024-12-25  本文已影响0人  梵仇不是大侠

自定义组件

组件的创建与引用

1.创建组件

2.引用组件

组件的引用方式分为“局部引用”和“全局引用”,顾名思义:

局部引用:组件只能在当前被引用的页面内使用

全局引用:组件可以在每个小程序页面中使用

3.局部引用

4.全局引用组件

在app.json 全局配置文件中引入组件的方式,叫做“全局引用”。

全局引入组件,在任何页面都可以使用组件了

全局引用组件和局部引用的使用场景就是 来看组件的使用频率范围来进行引入。

6.组件和页面的区别

7.组件的样式隔离

8.组件样式的注意点

app.wxss中 定义的全局样式是无法影响到组件的样式

只有class选择器会有样式隔离效果,id选择器,属性选择器,标签选择器不受样式隔离效果。

建议:在组件引用组件的页面中 建议使用class选择器,不要使用id 属性 标签选择器。

9.修改组件的样式隔离选项

默认是isolated 它还有其他的配置如下 styleIsolation的具体配置项

10 自定义组件中的 数据 方法 和属性

data数据 

methods方法 

自定义方法建议以_开头 便于区分

properties属性

在小程序组件中,properties是对组件的对外属性,用来接收外界传递到组件中的数据。示例代码如下:

data和properties的区别

vue中的props是只读的 小程序里的properties则不是

使用setData 修改 properties的值

11. 数据监听器

小程序组件的数据监听器

组件数据监听器的基本用法

监听对象属性的变化

数据监听器支持监听对象中单个或者多个属性的变化:

上一篇 下一篇

猜你喜欢

热点阅读