bug复现：

父组件需要传参数autoinputFs，autoinputFs为true的时候，子组件中的输入框（只有一个）自动聚焦，很多组件复用mp3Search，有些页面不需要，所以定义了autoinputFs控制输入框是否自动聚焦

<template><div>
<mp3Search :autoinputFs="true"></mp3Search></div>
</template>

子组件接受并监听

<el-input v-model="form.serchvalue" ref="myInput"><i class="el-icon-search" slot="suffix"> </i></el-input>props: {autoinputFs: {type: Boolean,default: false,},},
watch: {autoinputFs: {handler(newVal) {console.log(newVal, "newVal");this.$nextTick(() => {this.$refs.myInput.focus();});},},},

watch中的console.log()始终无法触发

解决方法：加上 immediate: true，立即执行一次监听函数

解决代码：

watch: {autoinputFs: {handler(newVal) {console.log(newVal, "newVal");this.$nextTick(() => {this.$refs.myInput.focus();});},immediate: true, // 立即执行一次监听函数},},

解决的方法不难，但是我觉得更需要知道的是为什么会产生这个bug

在监听器watch初始化时，Vue 并不会主动触发watch监听函数，除非设置了 immediate

在 Vue 中，当一个组件被创建时，父组件向子组件传递的 props 会被初始化并建立响应式关系。这意味着，如果父组件传递给子组件的 prop 发生变化，Vue 会负责检测这些变化并触发相应的更新。

然而，在 watch 中直接监听一个 prop 时，并不会触发初始的监听函数。这是因为 Vue 在组件初始化阶段不会主动去检测 prop 的变化，Vue 在创建组件实例时会在数据响应式系统中设置 prop 的初始值，但是在组件挂载之前，Vue 并不会立即将 prop 中的变化反映到实例的数据中，也就是说，只要组件挂载之前 prop 没有发生变化，watch中是无法触发的

这是为了避免在组件初始化时过多的计算和处理，只有在确实需要在初始化时对 prop 进行处理时才会执行一次监听函数