源文本字段的 Nativescript RadDataForm 值答案

【问题标题】：Nativescript RadDataForm value of source text fields源文本字段的 Nativescript RadDataForm 值
【发布时间】：2019-03-28 14:57:24
【问题描述】：

我的代码和这里类似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-model 并获取值并提交突变，但如何使用 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

怎么用？

【问题讨论】：

标签： javascript vue.js nativescript

【解决方案1】：

试试这个，

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

【讨论】：