Blame view

node_modules/uview-ui/components/u--form/u--form.vue 2.1 KB
c7add6cf   “wangming”   初始版本开发完毕
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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
  <template>

  	<uvForm

  		ref="uForm"

  		:model="model"

  		:rules="rules"

  		:errorType="errorType"

  		:borderBottom="borderBottom"

  		:labelPosition="labelPosition"

  		:labelWidth="labelWidth"

  		:labelAlign="labelAlign"

  		:labelStyle="labelStyle"

  		:customStyle="customStyle"

  	>

  		<slot />

  	</uvForm>

  </template>

  

  <script>

  	/**

  	 * 此组件存在的理由是,在nvue下,u-form被uni-app官方占用了,u-form在nvue中相当于form组件

  	 * 所以在nvue下,取名为u--form,内部其实还是u-form.vue,只不过做一层中转

  	 */

  	import uvForm from '../u-form/u-form.vue';

  	import props from '../u-form/props.js'
  	export default {

  		// #ifdef MP-WEIXIN

  		name: 'u-form',

  		// #endif

  		// #ifndef MP-WEIXIN

  		name: 'u--form',

  		// #endif

  		mixins: [uni.$u.mpMixin, props, uni.$u.mixin],

  		components: {

  			uvForm

  		},

  		created() {

  			this.children = []

  		},

  		methods: {
  			// 手动设置校验的规则,如果规则中有函数的话,微信小程序中会过滤掉,所以只能手动调用设置规则
  			setRules(rules) {
  				this.$refs.uForm.setRules(rules)
  			},

  			validate() {

  				/**

  				 * 在微信小程序中,通过this.$parent拿到的父组件是u--form,而不是其内嵌的u-form

  				 * 导致在u-form组件中,拿不到对应的children数组,从而校验无效,所以这里每次调用u-form组件中的

  				 * 对应方法的时候,在小程序中都先将u--form的children赋值给u-form中的children

  				 */

  				// #ifdef MP-WEIXIN

  				this.setMpData()

  				// #endif

  				return this.$refs.uForm.validate()

  			},

  			validateField(value, callback) {

  				// #ifdef MP-WEIXIN

  				this.setMpData()

  				// #endif

  				return this.$refs.uForm.validateField(value, callback)

  			},

  			resetFields() {

  				// #ifdef MP-WEIXIN

  				this.setMpData()

  				// #endif

  				return this.$refs.uForm.resetFields()

  			},

  			clearValidate(props) {

  				// #ifdef MP-WEIXIN

  				this.setMpData()

  				// #endif

  				return this.$refs.uForm.clearValidate(props)

  			},

  			setMpData() {

  				this.$refs.uForm.children = this.children

  			}

  		},

  	}

  </script>