vuejs+layui的使用

Vue2+VueRouter2+webpack+Axios 构建项目实战目录以及文件结构

之前在项目中一直使用的是 element-ui

但需要使用到流加载数据,这个 element-ui 中没有

没关系,这个流加载 在layui 中有现成的,下面让我们使用 layui :

官网:http://www.layui.com/

demo: http://www.layui.com/demo/flow.html

vuejs 是项目根目录

下载解压后,把 layui 放到 vuejs/static里面 , 目录如下:

vuejs+layui的使用_第1张图片

编辑 vuejs/index.html , 加载 layui ,内容如下



  
    
    
    
    
    
    我的博客
  
  
    

新建一个组件 vuejs/src/components/layui/flowdemo.vue 内容如下:




编辑 vuejs/src/router/index.js , 添加组件和路由,内容如下:

vuejs+layui的使用_第2张图片

最后访问即可: http://localhost:8081/#/flow  效果如下:

vuejs+layui的使用_第3张图片

 

 

 

 

 

 

你可能感兴趣的:(vue,layui)