laravel-5 - 如何在 Vuejs 2 和 bootstrap 3 + laravel 中创建带有排序搜索组件的列表

Question

我是 vuejs 的新手，所以任何人都可以解释如何创建列表（例如 User、My Order like grid）组件。

我找到了一种最佳解决方案，但这在 bootstrap-3 中不兼容，但我现有的项目在 bootstrap-3 下

我想在 bootstrap3 中与此类似： https ://bootstrap-vue.js.org/docs/components/table#complete-example

是否有任何 bootstap-vue 版本与 bootstap3 兼容，如果没有，请提供替代解决方案。

预先感谢。

标签： laravel-5vuejs2

Answer 1

你可以使用https://ratiw.github.io/vuetable-2 该组件是高度可修改的，你可以在他的 props 中传递带有类的对象，以使表格与每个 css 框架一起工作：

模板：

<vuetable ref="movementsTable"
           :css="table"
           api-url="api/movements/resource"
           :fields="fields"
           pagination-path=""
           ></vuetable>

状态：

data() {
  return {
    table: {
      tableClass: 'table table-hover',
      loadingClass: 'loading',
      ascendingIcon: 'fa fa-chevron-up',
      descendingIcon: 'fa fa-chevron-down',
      handleIcon: 'fa fa-caret-left',
    },
  },
},

检查这个例子！https://github.com/ratiw/vuetable-2-with-laravel-5.4