版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_30756923/article/details/84630619
就是如下这种总效果:
点击搜索框(上图)- 出现带热门搜索、历史搜索的页(下图)
解决:
1.搜索框input加 @focus="this.$router.push('/search')" 路由跳转新页面
2.新页面钩子函数
created() {
$('#input').focus()
}
无效!!!好吧!
3.亲测有效
created() {
setTimeout(() => {
$('#input').focus()
}, 0);
}
4.究其原因还是对钩子理解不够深刻啊!
created
官方说明:实例已经创建完成之后被调用。在这一步,实例已完成以下的配置:数据观测(data observer),属性和方法的运算, watch/event 事件回调。然而,挂载阶段还没开始,$el 属性目前不可见。
mounted
官方说明:el
被新创建的 vm.$el
替换,并挂载到实例上去之后调用该钩子。如果root
实例挂载了一个文档内元素,当 mounted
被调用时 vm.$el
也在文档内。
5.完事!!!
mounted() {
$('#input').focus()
}
挂钩需谨慎啊!!
记录自勉吧