Question

我的代码类似https://play.nativescript.org/?template=play-vue&id=TO4i2n&v=4

我需要RadDataForm的值来更新Vuex状态对象，该对象是RadDataForm的源。

所以我想这样做，但是不使用单个文本字段，而是使用RadDataForm https://vuex.vuejs.org/guide/forms.html

Vuex商店：

const state = {
    items: { 
        mainTab: {
          HPval: 10,
          MANA: 0,
          'type': '',
        },
}

RadDataForm

                <StackLayout row="0">
                    <RadDataForm
                        :source="mainTab"
                        @propertyCommitted="updateMessage"
                        :metadata="mainTabMetadata">
                    </RadDataForm>
                </StackLayout>

 computed: {
         ...mapState({
                mainTab: state => state.inputValues.items.mainTab,
         })
}

并在propertyCommited运行方法updateMessage上。我需要实际修改字段的值（文本），但是没有任何值。您可以看到我想进行突变以更新状态，例如此处https://vuex.vuejs.org/guide/forms.html，但我没有价值。

updateMessage (e) {
            console.log("PropertyCommitted");
             console.log(e);
            //console.log(e);
            //console.log(this.val);
            //console.dir(e.text);
            this.$store.commit('updateMessage', e.target.value) 
         },

这是商店中的突变

updateMessage (state, data) {
      state.items = data
      console.log("PropertyCommitted mutation fired");
    }

控制台日志显示。


JS: object: RadDataForm(940) 
JS: editor: "undefined" 
JS: entityProperty: EntityProperty(958)
JS: propertyName: "MANA" 
JS: group: "undefined" 
JS: groupName: "DefaultGroup" 
JS: returnValue: "true"

在正常的TextField上，我可以使用v模型并获取值并提交突变，但是如何使用RadDataForms解决此问题？

写着https://docs.nativescript.org/ui/professional-ui-components/DataForm/GettingStarted/dataform-start-result

另一个事件-propertyCommitted-在提交属性后调用，因此您可以使用它从源对象或通过RadDataForm的editedObject属性获取新值。

https://docs.nativescript.org/ns-ui-api-reference/classes/raddataform#editedobject

如何使用它？

Answer 1

尝试一下

     updateMessage (e) {
        let property = data.object.getPropertyByName(data.propertyName);
        this.$store.commit('updateMessage', property.valueCandidate);
     },

源文本字段的Nativescript RadDataForm值

1 个答案: