如何将ref调用到挂载函数中

Question

<f7-input ref="input" placeholder="Enter a location" type="text"></f7-input>

mounted(){
  var n = this.$refs.input
}

它说：

挂载挂钩错误：“TypeError：无法读取未定义”

的属性'input'

有没有办法获得输入值？ 在此先感谢

Answer 1

检查您是否实际使用该组件 - 导入后是否将其添加到components？

Answer 2

来自Vue docs：

  

关于ref注册时间的一个重要注意事项：因为refs本身是由render函数创建的，所以你不能在初始渲染时访问它们 - 它们还不存在！

看起来mounted事件太早，无法抓住$refs。将此代码移近实际需要input标记值的位置。

Answer 3

您可以使用其他方法。 在子组件的this.$emit('loaded');方法中进行一个事件（如mounted），并在组件中使用一个函数来获取$ref