小程序 笔记

1、 表单处理

  a、form标签: bindsubmit属性用于设置方法来监听表单的提交事件,对应的表单提交按钮的form-type属性设置为submit。 bindreset用于设置方法来监听表单的重置事件,对应的表单提交按钮的form-type属性设置为reset

  bindsubmit => form-type="submit"

  bindreset=> form-type="reset"

  b、监听输入事件需要用bindinput

  c、表单元素需要设置name属性,name是json数据的key,可以根据key取到对应值,e.detail.value拿到表单提交数据;value绑定值,e.detail.value取值;可以设置id,通过e.target.id拿到值,进行一些操作。

  d、button:form-type设置按钮的类型,有submit、reset,submit提交进行数据交互处理,reset进行表单数据重置。open-type设置是否需要进行授权,打开会话等一些微信开放能力,包括share(打开分享),contact(打开会话),getPhoneNumber(调起授权手机号),getUserInfo(获取用户信息),launchApp(打开app),openSetting(打开设置权限页),feedback(打开反馈页面)。通过bindgetphonenumber=“xxx”,设置方法,拿到回调,进行数据处理。

2、所有的属性绑定都要用{{}},{{}} 内部可以进行简单运算;没有wx:show。背景图需要用线上图片或者二进制数据流才能解析。很多html标签是不能按预期显示的,比如table,strong ,可以写然后自己定义样式。

3、this.setData({})设置data中定义的属性

4、自定义组件

  a、新建组件

  b、然后在需要用到组件的page中配置xx.json页面的useingComponent对象,key为组件的标签名,value填写组件的目标路径。

  c、在xx.wxml中写入组件名作为标签即引入了组件

  d、组件之间的数据传输:

   父组件->子组件:父组件中将需要传输的数据直接以自定属性的样子写在组件tag上,属性名是子组件接收数据的数据名,值用{{}}包裹,是父组件中data中定义的需要传输给子组件的变量,或者直接值。

           子组件在properties对象内接收,数据以对象的形式设置数据类型,数据默认值。然后子组件可以使用。

  子组件->父组件:在子组件中以triggerEvent对外广播事件xxx,params是数据参数=>this.triggerEvent('xxx', params);

          在父组件中的组件tag上监听xxx事件,以getxxx处理事件监听,拿到数据,bindxxx=“getxxx”;

5、自定义的组件内不能使用css属性选择器。组件的dom流是直接向下排列的,所以比如弹窗类的组件需要css设置定位到top:0;

原文地址:https://www.cnblogs.com/muzs/p/10728830.html