iview表单局部清除和render渲染的组件下使用ref

切换Radio单选框时，对应的Input已经置为了不可编辑，但表单验证的信息仍然存在。

两个Radio各对应三个Input，所有Input都加了Form表单，当在切换Radio时，将对应的Input设为可编辑，另外三个置为不可编辑。而这时候会发现另外三个已经置为不可编辑的框的表单验证仍然生效了。解决办法：

在Radio的on-change回调中加一句：this.$refs['formValidate'].validate()。

这里iview官网也提供了清除表单的方法:this.$refs.xxx.resetFields()。 但是在我们上面那种场景下这样直接清除会带来一个问题。

比如说我有多个Input，这些Input是单独的，没有Radio或其他东西作为父元素 。而这些单独的Input又和嵌套了Radio的Input一起加了Form表单验证。这时候如果在切换Radio时调用this.$refs.xxx.resetFields()方法，会发现所有的Input表单提示都被清除了。如果这些单独的Input中的内容是不应该通过的，那这个bug是不能忍的。

官网提供的resetFields是对整个表单验证进行清除，而第一种办法是局部的。局部清除表单还有种办法，但是需要拿到参数值，然后在看iview底层来拿到你所需要清除的表单元素来做。因为需要参数值所以只能在传了formValidate的方法里面这样做。具体用那种看个人的情况。

---

在render创建的组件或标签中添加ref

有些情况下需要拿到一些元素，如果这些元素是在html代码中，可以直接通过ref="test"添加，但是如果某些元素是通过render动态创建的，那直接在render的函数中写ref是没用：

添加ref

这种方式添加的ref不会报错，但在调用this.$refs.test的时候会为undefined，因为ref是作为渲染结果被创建的，所以在初始渲染时它们根本不存在，所以为undefined，即便把ref="test"写在props中结果也一样。如果要在这里动态添加ref，就不能使用h函数，而是使用$createElement：

render: (h, params) => {

            let create = this.$createElement

            let dom = create('InputNumber', {

              ref: 'skuRef' + params.index,

              on: {

                'on-change': (value) => {

                    console.log('change')

                }

              }

            })

            return dom

        }

这是我在针对创建多个InputNumber时的做法，因此后面加了params.index，用来区分不同的InputNumber，具体场景根据实际业务需求来。