Rails + Vue.js - Using Ajax to update Vue component
You shouldn't call a render for a whole component, you should instead make a global component that receives an array of users as variable, something in the lines of:
window.users = [ { id: 'this-is-an-id', name: 'Evan', age: 34 }, { id: 'unique-id', name: 'Sarah', age: 98 }, { id: 'another-unique-id', name: 'James', age: 45 },];<ul> <li v-for="person in users" :key="person.id"> {{ person.name }} - {{ person.id }} </li></ul>
Then when you change the users
variable, your Vue component will change too. So instead of overriding the whole HTML for the component, make you .js.erb
append to users variable:
response_users = <%=j @users.last(12).as_json %>;Object.assign(users, response_users);