vue中点击菜单,更换对应的选中的图片和字体颜色
vue中点击菜单,更换对应的选中的图片和字体颜色
我都是直接截的图,这样可以让你们边看边自己敲,这样可以更好的学习,脑过千遍不如手过一遍
将菜单数组写好或者可以用后台数据(必须有选中的和未选中的图片路径,图片必须用require引入,不然无法显示)
for循环到页面上,在data中声明一个变量inx
在点击事件中传一个index下标,当点击的时候将声明的变量等于下标
在渲染图片的时候通过三元运算符渲染,当点击的下标等于声明的变量值的时候展示点击选中的图片,
更换字体颜色通过动态绑定class名,当点击的下标等于声明的变量值的时候class名为active,在css中写自己需要显示的颜色
觉得有帮助的话可以关注一下,有时间会持续更新