How to handle the dynamic parameter passing of query in vue-router-JS Tutorial-php.cn

This time I will show you how to handle the dynamic parameter transfer of query in vue-router, and what are the precautions for dynamic parameter transfer of query in vue-router. The following is a practical case, let's take a look.

I have been writing a project recently. In the process of writing the project, I always find problems of one kind or another. For example, how does the query in vue-router pass dynamic parameters? After some twists and turns, the problem was solved.The problem is described as follows:

I hope the url will be like this when jumping: http://localhost:8080/editmovie?id=****

修改

Copy after login

but? The above is just a static one, the url will always be: http://localhost:8080/editmovie?id=111

In fact, the id I need is placed in a hidden element In:

Copy after login

At first my idea was to call the methods in the components, but I tried several times and failed. Then I accidentally saw a question and answer

vue-router dynamically configures the incoming parameters problem, and then I saw the following code:

   {{el.tourism_name}} {{el.tog_line_id}}
 {{el.address}}

Copy after login

I suddenly felt like I had an idea. The solution is as follows:

Bind the id of li to the id in the data, and then write the bound id in the query.

修改

Copy after login

export default { name : 'Movie', data() { return { id : "" } }, methods: { getId () { var id = $('.hiden').eq(0).text(); console.log(id); } }, mounted() { this.id = $('.hiden').eq(0).text(); }, components : { Heade, Foot } }

Copy after login

I believe I read it You have mastered the method in the case of this article. For more exciting information, please pay attention to other related articles on the php Chinese website!