Hotlist.vue

<template>
  <div>
    <md-table v-model="users" md-sort="title" md-sort-order="asc" md-card md-fixed-header>

      <md-table-row slot="md-table-row" slot-scope="{ item }" style="margin-top:100px">
        <md-table-cell md-label="재고" md-sort-by="stock" md-numeric>
          {{
          item.stock
          }}
        </md-table-cell>
        <md-table-cell md-label="전공" md-sort-by="major">
          {{
          item.major
          }}
        </md-table-cell>
        <md-table-cell md-label="책이름" md-sort-by="title">
          {{
          item.title
          }}
        </md-table-cell>
        <md-table-cell>
          <md-button class="md-primary md-raised">구매</md-button>
        </md-table-cell>
        <md-table-cell>
          <md-button class="md-raised md-accent">판매</md-button>
        </md-table-cell>
      </md-table-row>
  
    </md-table>
  </div>
</template>

<script>
const toLower = text => {
  return text.toString().toLowerCase();
};

const searchByName = (items, term) => {
  if (term) {
    return items.filter(item => toLower(item.title).includes(toLower(term)));
  }

  return items;
};
export default {
  name: "TableSearch",
  data: () => ({
    users: [
  
    ]
  }),
  methods: {
  },
  created() {
      this.$http.get("/api/books").then(response => {
      this.users = response.data;
      console.log("success");
      console.log(this.users);
    
    });
  }
};
</script>

<style lang="scss" scoped>
  .md-field {
    max-width: 500px;
  }
</style>