vue+element中怎么利用change事件，使选择器选中某一个值之后，弹出另一个选择器？

Posted 2023-04-27

下面是我的代码

在@change事件里用v-if判断就好了。先过去第一个选择器的key值，假如是第二个，那当key===2的时候就把v-if对应的参数改成true即可。 参考技术A 都是选完一个，加载下一个， 没见过说选完一个，下一个自动弹开的 参考技术B

你的代码实在是看不清，你可以去问问老师

参考技术C 你的图片打开之后什么也看不到，请您再传一张清晰写的好吗？ 参考技术D 这个就是因为你的代码出现了一些小问题，所以你可以好好帮他检查一下，看看能否有继续改进的地方。

Vue element Switch @change事件死循环解决方式

参考技术A 在Vue项目中用了一个el-switch组件,点击后触发事件,做出对应的操作.如果失败,swich再返回原来的值.

嗯.....逻辑上是没有错的.

错误使用方式一

<el-switch v-model="startWithSystem" @change ="OnAutoStart(startWithSystem)"></el-switch>

于是我看了文档,使用了change事件触发......

然后你就会发现,为什么风扇的转速特别快,浏览器无法点击了....

F12的log打印不断的在滚动.

哦...死循环了

错误使用方式二

于是想到了click事件

<el-switch v-model="startWithSystem" @click ="OnAutoStart(startWithSystem)"></el-switch>

使用@是不行的,不工作,

错误使用方式三

<el-switch v-model="startWithSystem" :click ="OnAutoStart(startWithSystem)"></el-switch>

:是工作起来了,但是....会执行很多次....应该是页面的任何点击都被捕获了..这样肯定不行

正确的方式

使用change事件是不行的,这样不论你点击修改还是js修改,都会触发,它自身的点击事件是无效的,

那么将其放入一个div中, 使用父容器的@click事件 ,就可以好好工作了

```

<div class="padRight" @click="OnAutoStart(startWithSystem)">

        <el-switch v-model="startWithSystem"></el-switch>

</div>

```