I'm trying to get data from the server with the socket. But vue does not fill the table, because the client has an array, and the server returns objects.
serverside
...
const r = require('rethinkdb');
const io = socketIO(server);
r.connect(db)
.then(conn => {
io.on('connection', (client) => {
r.table('messages')
.run(conn)
.then(cursor => {
cursor.each((err, message) => {
io.sockets.emit('messages', message);
});
});
client- vue
<template>
....
<table>
<tr>
<th>name</th>
<th>message</th>
<th>date</th>
</tr>
<tr v-for="object in objects" :key="object.id">
<td>{{object.id}}</td>
<td>{{object.name}}</td>
<td>{{object.message}}</td>
<td>{{object.date}}</td>
</tr>
</table>
...
<script>
export default {
name: 'App',
data () {
return {
objects: []
}
},
methods: {
send () {
this.$socket.on('test',message => {
this.objects = message
console.log(message)
})
}
}
in console: but vue needs array of objects: myrepo (fullcode) https://github.com/EvgenJin/REVN_project
You should probably just use push on the array.
this.$socket.on('test', message => {
this.objects.push(message)
})
Since in the HTML you're expecting an array of objects.