matiastucci/vue-input-tag

How to refresh v-model maually?

jiangzhen1984 opened this issue · 6 comments

jiangzhen1984 commented

Version of Vue I'm using?: 2.5.16___
Version of vue-input-tag I'm using?: 2.0.1_

Hello:
Maybe it's not a issue, I just want to know how to manually refresh tags?
Scenario Description:

step１ create {
get value by ajax
}

step 2. computed: {
Initialize form values, at this time maybe ajax request not finish yet.
Some time get default value for initialization
}

matiastucci commented

I'm not sure if I understand. When you use the component you pass your array of tags doing v-model="tags". If you want to change your the tags that the input is showing you just need to update your component's data tags prop. If this not answers your question, can you create a JSFiddle with an example, please? and I'll reopen the issue. Thanks.

jiangzhen1984 commented

Hello:

Please let me re-open this question for double confirm:

Code snapshot, doesn't refresh tags for display.

`< input-tag placeholder="添加显示标签" v-model="articleForm.tags">

250 created() {
....
.... //send ajax request to back-end server
258 this.$store.dispatch('getArticleDetail', id).then(res => {
259 const pDetail = this.$store.state.article.articleDetail;
.....
267 this.articleForm.tags = pDetail.tags; <==== update tags v-model
268 this.articleForm.title = pDetail.title;
269 this.articleForm.content = pDetail.content;
270 }
271 });
272 }
`

matiastucci commented

I don't think it's a bug related to the library. Again, please create a JSFiddle with an example so I can reproduce it. Also, if you paste code here, at least try to format it nicely. Remove the line numbers for example. You can use a ``` block in Markdown to show the code in a nice way. Thanks.

jb-anderson commented

Hello!

I believe I'm having the same issue, on the current version of the library, which is that updates to the property specified by v-model do not cause the input to update. Here's a jsfiddle I made to demonstrate: JSFiddle

I've solved it for my own purposes by forking the library, and adding a watch on the value property, and updating the innerTags property when it changes. I could probably submit a PR if you'd like, let me know. Thanks!

  • 👍1
matiastucci commented

Sure, PRs are welcome! Thanks 👍

manasvi-livspace commented

Hi, I am having the same issue. If I am using a value defined in data observables, then it shows up in the input-tag. But if I am getting the value through ajax call, it is not reflected in the input-tag. Please check my fiddle JSFiddle and let me know what can be done. Thanks