uniapp中 form-input 没有执行 handleRef
Chaos0221 opened this issue · comments
Ashley commented
组件
form-input
基础库版本
- 2.x
设备机型
ide
手机系统
- iOS
APP
uniapp 支付宝端
组件库版本
2.x
预期行为
复现步骤
在uniapp中使用form-input组件,handleRef这段代码没有执行,提交表单时获取的values也是空对象,请问是什么原因?是绑ref的方式不对吗
复现 demo
代码:
// template
<ant-form-input
label="label1"
name="name1"
@ref="handleRef"
/>
// js
onLoad() {
this.initForm()
},
methods:{
initForm() {
this.form = new Form();
},
handleRef(ref) {
console.log('ref:', ref)
this.form.addItem(ref);
},
}
homi commented
参考以下例子在uniapp中通过this.$refs
获取ref
<template>
<div>
<!-- 绑定 DOM 元素的 ref -->
<input ref="myInput" />
<!-- 绑定子组件的 ref -->
<my-component ref="myComponent"></my-component>
</div>
</template>
<script>
import MyComponent from "./MyComponent.vue";
export default {
components: {
MyComponent
},
mounted() {
// 访问 DOM 元素的引用
this.$refs.myInput.focus();
// 访问组件实例的引用
this.$refs.myComponent.doSomething();
},
methods: {
doFocus() {
// 在方法中访问 DOM 元素的引用
this.$refs.myInput.focus();
},
doComponentAction() {
// 访问组件实例的引用
this.$refs.myComponent.doSomething();
}
}
};
</script>
Ashley commented
this.$refs.handleRef.forEach(ref=>{
this.form.addItem(ref);
})
这样写之后绑定上了,感谢