I wrote the front-end page using vue. I have already written the like and unlike api. You only need to transfer the article ID to the api. There is also an api to determine whether you have liked it. Already articles are also obtained through the api
The problem I'm encountering now is that I want to make changes to the style. That is, when the page is initially loaded, it will be determined whether you have liked this article, and then the style will be the style of the like. But the article is generated by v-repeat (similar to ng-repeat). I added a filter to the article to see if the current article has been liked, and rewritten the dom in the Ajax callback. However, due to asynchronous issues, the rewritten dom was rendered by vue. It’s invalid. Is there any good way?
I have done something similar, but using angularjs
It’s the same as before, but I thought of a way for the likes class, you can see if it suits you:
For example, nice is a Boolean value in the lists (returned by the server) array. If the judgment point has not been clicked, use this value to cycle through the like button class when loading for the first time
Then add an ng-click to the like button to send http. After the sending is successful, change the Boolean value of list.nice, and then change the state. To determine the position of list.nice, pass an $index to the method that encapsulates http. Alright.
The rewriting of the dom you mentioned does not actually change the value of the two-way binding. It is still traditional jquery thinking. Changing the binding value should be a more appropriate method. You can try it.
You should use vue’s own methods to manage styles instead of manually changing the dom