NightCatSama/vue-slider-component

[vue3.x] 无法对数组值进行双向更改

er-ya opened this issue · 4 comments

er-ya commented

Describe the bug

A clear and concise description of what the bug is.

Additional context (If there is no relevant content, please delete the block)

Add any other context or screenshots about the feature request here.

Environment (If you feel unrelated, please delete the block)

  • OS & Version: [e.g. macOS, Windows, Linux]
  • Vue version: [e.g. v3.0.0]
  • Component Version: [e.g. v4.0.0-beta.1]
    vue3无法对数组值进行双向更改
    input的值改变 滑动输入条不会跟随输入值发生位置改变
    但滑动时input输入框内的值会跟随滑动值发生变化

或者是我哪里写的有问题，请帮我看一下 谢谢

QQ图片20210419151725
QQ图片20210419151413

NightCatSama commented

vue 是响应不到这样直接设置数组单个值的，你可以用 map 或 filter 去更改值，或者设置完后 this.value = this.value.slice() 去强制更新数组变化

er-ya commented

@NightCatSama 但是我给input输入框加了一个change事件发现当输入框的值改变的时候数组中的值同样也会改变，只是无法更新到滑动条上
1

然后我还想问一下 这里这个v-model=“currentValue1”不可以写成v-model：value=“currentValue1” 当currentValue1是数组时加上：Value滑动条就会变成单个的
2

麻烦您在帮我看一下哦！谢谢啦。

NightCatSama commented

@er-ya

  1. 是因为值虽然变了，但是 vue 没有监听到变化的。这个在 vue2 开始就是这样的，文档有写 https://vuejs.org/v2/guide/list.html#Mutation-Methods

  2. 因为 vue3 默认名称是已经改成 modelValue 了，所以用 v-model:value 是没法同步到组件里的值的。

er-ya commented

@NightCatSama 好的，非常感谢，问题已经解决了，麻烦您了！

  • 🎉1