0

我有 3 个这样的输入：

<input type="text" v-model="settings['apple']" />
<input type="text" v-model="settings['banana']" />
<input type="text" v-model="settings['orange']" />

当用户为输入输入值时，我想获取用户输入的值以处理值并更新新值。我正在使用计算属性来处理值：

data() {
            return {
                settings: {}

            }
        },

    computed: {
            settings: {
                set: function (newValue) {
                    var parts = newValue.match(/[\s\S]{1,2}/g) || [];

           // Set new value ...
                }
            }
        },

问题是我如何知道用户输入了哪个输入并设置了新值？

4

2 回答 2

4

中定义的属性data应该computed是互斥的——在两个地方定义相同的属性是自找麻烦。此外，数据下的对象应具有默认值。

因此，相反，让您的计算返回一个不同的对象，该对象是所有转换后的值。保留您的输入绑定的设置v-model。然后，您可以单独绑定到计算对象并根据需要将其显示给您的用户。

data() {
        return {
            settings: {
                "apple": "",
                "banana": "",
                "orange": ""
            }
        }
    },

computed: {
        transformed_settings: function () {
            /* create and return an object with transformed apple, banana, orange */
        }
    },
于 2016-04-20T01:09:32.900 回答
0

最简单的方法是将 apple、banana 和 Orange 声明为数据元素或变量。根据方法（未计算）下的用户输入定义函数，然后在输入框中使用 @change="CheckUserInput" 属性

于 2019-12-06T13:22:51.153 回答