PGzxc
PGzxc

微信小程序开发之——调查问卷-表单数据绑定(2.2.4)

一 概述

  • 表单数据绑定的实际需求
  • 将data数据替换表单默认数据
  • 服务器返回data数据给微信小程序

二 实际需求

前面的小节中，表单是完全编写在WXML中的，然而在实际开发中，会经常需要对表单的默认值进行变更。例如，用户发现已经提交的调查问卷中有些内容填写错误，需要进行修改，希望程序提供一个修改的表单，该表单默认已经填写了上次提交的内容，这就需要从服务器获取已经提交的数据，然后将数据填入到表单中

三 将data数据替换表单默认数据

3.1 修改的数据

  • 针对上述需求，可以通过表单数据绑定来实现。
  • 首先在pages/index/index.js文件的data数据中保存表单的默认数据

3.2 index.js中data数据

1
2
3
4
5
6
7
8
9
10
11
12
13
14

data: {
   name:'张三',
   gender:[
     {name:'男',value:'0',checked:true},
     {name:'女',value:'1',checked:false}
   ],
   skills:[
     {name:'HTML',value:'html',checked:true},
     {name:'CSS',value:'css',checked:false},
     {name:'JavaScript',value:'js',checked:false},
     {name:'Photoshop',value:'ps',checked:false}
   ],
   opinion:'测试'
 },

3.3 index.wxml中代码(预览画面已有数值)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33





姓名：




性别：






  专业技能：
  
    
  



  您的意见：