获取计算 属性 并在编辑另一个文本字段时传递其值 vue.js

Question

我想在编辑文本字段的同时发送经过计算的 属性，因此没有指向 "save" 的按钮，但是我不知道如何获取 属性来自另一个字段或来自计算数据的值传递过来。

到目前为止，这是我的代码，activeNote.id 可以在模板中查看没问题，但我想在我输入文本区域时传递它的值

<template>
  <div class="editor">
    <form id="editForm">
      <h2>Edit</h2>
      <button @click="closeEdit()">Close</button>
      <textarea
        v-bind:value="activeNote.text"
        @input="editNote"
        class="form-control"
      ></textarea>
      <input v-bind:value="activeNote.id" name="id" readonly />
    </form>
  </div>
</template>

<script>
import { mapState } from 'vuex'

export default {
  methods: {
    // not sure this is best practice to dispatch from here
    editNote(e) {
      this.$store.dispatch('editNote', e)
       // activeNote.id doesnt work here unfortunatly
      this.$store.dispatch('noteId', activeNote.id)
      //console.log(activeNote.id)
    }
    closeEdit() {
      //console.log('emitclose')
      this.$emit('closeEdit')
    }
  },
  computed: mapState({
    activeNote: state => state.activeNote
  })
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped></style>

Answer 1

最后很简单，所以 fyi 更改后的代码有效，添加了这个。

<template>
  <div class="editor">
    <form id="editForm">
      <h2>Edit</h2>
      <button @click="closeEdit()">Close</button>
      <textarea
        v-model="activeNote.text"
        @input="editNote"
        class="form-control"
      ></textarea>
      <input v-bind:value="activeNote.id" name="id" readonly />
    </form>
  </div>
</template>

<script>
import { mapState } from 'vuex'

export default {
  methods: {
    editNote(e) {
      this.$store.dispatch('editNote', e)
      this.$store.dispatch('noteId', this.activeNote.id)
    },
    closeEdit() {
      this.$emit('closeEdit')
    }
  },
  computed: mapState({
    activeNote: state => state.activeNote
  })
}
</script>