[Vuejs]-How to initialize data in a Vue.js component from SQL query

0👍

Maybe like this:

module.exports.getAll = function (table) {
  return new Promise((resolve, reject) => {
    const sql = `SELECT * from ${table}`

    dbConnect();
    db.all(sql, (err, rows) => {
      db.close()
      err ? reject(err) : resolve(rows)
    })
  })
}

<template>  
  ...
  <tr v-for="file in listings">
    <td>{{ file.filename }}</td>
    <td>{{ file.type }}</td>
    <td>{{ file.size }}</td>
    <td>{{ file.path }}</td>
  </tr>
  ...
</template>

<script>
  import model from '../../model.js'

  export default {
    data() {
      return {
        listings: []
      }
  },
  methods: {
    async initListings () {
      this.listings = await model.getAll('files')
    }
  },
  created() {
    this.initListings()
  }
</script>

Leave a comment