微信小程序基础知识1

1，rpx会根据屏幕大小进行调节，px不会；

2，在样式中设置display：flex就会变成弹性盒子；

想要各个样式平均分配添加

justify-content：space-around属性

3.小程序中data中传参了，但是修改要在onLoad里面用一个this.setData（{属性：‘’}）

在这里面修改，不能直接this.data.name="";

4：小程序里的绑定事件是这样的举例:

wx:if wx:elif wx:else

5：想要遍历 要在遍历的外层套一个block标签，它不会被渲染，只是在循环时做包裹用。

在这个标签里面写wx：for="{{遍历的名称}}"

默认每一项是叫item索引是index

（索引想要显示用view{{index}}view显示）

--------item和inidex是可以改的-----

wx:for-item="course",wx:for-index="idx"这样就改变了

6：vue中bind绑定事件，v-on绑定属性，

但是在小程序中bind绑定事件且没有冒号直接在后面接写事件；

7：阻止冒泡用catch代替bind，

（哪个换成catch哪个就输出 catch事件名=“方法名")

捕获冒泡用 capture-bind:事件名="方法名"，捕获就先输出最外层的在输出里面的。

8：基础组件icon -----各种标识

<icon type="图标名称">< icon>

可以设置颜色大小   有效值：success, success_no_circle, info, warn, waiting, cancel, download, search, clear

9：基础组件progress  ----进度条

 

这样写:<progress percent="30" show-info="true" border-radius="10" stroke- width="50rpx" activeColor="red" backgroundColor="#000" active="true">
</progress>

10：基础组件rich-text可以显示html内容

正常在wxml中显示div或者span的内容是以普通文本显示，解析不出来标签

在wxml标签中在nodes里面写{{data里面的属性名字}}就会解析标签了例如：

<rich-text nodes="{{textStr}}"></rich-text>

理解它：我们在后台获取了一堆html内容想要在小程序中展示内容就用rich-text-nodes

11：基础组件text----文本是否可选

<text selectable="true">小程序</text>

这样这个文字就可以被选中了