javascript - Problems with reading data in vuejs

Question

As shown in the picture, I used vuejs to write a small demo for posting, but now I can only read the img field in the post. How to read all the fields?

html code

js code

Answer 1

1. FileReader is used to read files locally, generally only applicable to <input type="file"></input>

2. And your title and content have nothing to do with FileReader. They are only affected by newPost in your data(). So you can change vm.post.push({img: this.result}) in creatPost to

vm.post.push({
    title: vm.newPost.title,
    content: vm.newPost.content,
    img: this.result
})

// 同时在最后把post清空
Object.keys(vm.newPost).forEach(item => vm.newPost[item] = '')

Answer 2

Isn’t the data already in this.newPost?

You bind the data of this.newPost to the dom through v-model. Instead of getting it from this.newPost, you get the data from the dom instead?