与 createElement 一起使用时，vuejs ref 属性无效

【问题标题】：vuejs ref property has no effect when using with createElement与 createElement 一起使用时，vuejs ref 属性无效
【发布时间】：2018-05-12 06:32:16
【问题描述】：

我已经为 Vue 组件编写了一个自定义渲染函数，但是当我在传递给 createElement 函数的数据对象中设置“ref”属性时，根 vm (VueComponent) 的 $refs 中没有显示任何内容)

Vue.component('sm-form-row', {
        render: function (createElement) {
            // Create the Row Div and append the columns
            return createElement('div', {
                    class: {
                        'row': true
                    },
                    ref: 'some computed value'
                });
        }
});

我错过了什么，该类被正确应用但 $refs 一直显示为空。

【问题讨论】：

您如何以及在何处（生命周期挂钩）访问 $ref 对象？
好的。发现了问题。我正在查看根级别组件的 $refs 。它实际上是在定义该组件的父组件下创建 refs。
您仍然可以在创建它的同一个组件中访问引用，诀窍在于您获得它的生命周期。您始终可以创建一个计算属性来检查要创建的元素

标签： vue.js vuejs2

【解决方案1】：

ref 已应用，我创建了一个fiddle 以查看它是否有效。

但是，如果要添加对sm-form-row组件的引用，则必须在父组件中添加ref属性。例如在父组件中：

<sm-form-row ref="formRow" />

在您的父组件中，您可以通过以下方式访问它：

this.$refs.formRow

您还可以访问子组件的方法。例如，如果子组件有一个名为 myMethod 的方法，您可以像这样在父组件中访问它：

this.$refs.formRow.myMethod

【讨论】：

我想为动态创建的元素创建引用。
是的，正在创建参考
所以你想动态设置 ref？这很简单。我更新了我的 fiddle 并使用从父组件传递的动态值设置 ref。看看