axios vue 动态date_使用vue构建网站，通过axios将数据显示到表格

Vue构建网站网站是现在的大势所趋，通过vue axios构建的网站相比传统的网站混写更加有利于保障后端源码的安全，同时也可将网站打包成软件直接发布减少网站和app的双重开发。

此次主要讲解怎样在vue element的环境下，将数据显示到表格中，怎样通过axios与后端(thinkphp)交互，显示后端返回的数据。

效果图：

目前集成库情况

截止目前集成的JavaScript库和调用形式如下：

1、 element-UI。参考官网。

2、 Vant。参考官网。

3、 Vue-cookies。调用形式参考官网，在eui中通过this.$cookies进行调用。

4、 Echarts。请参考我的文章《3、手把手构建前后端分离网站，怎样通过后台数据动态操作echarts图表》中有详细的调用和设置方法。

5、 Axios。使用例子可参考官网，将axios换成Eui集成调用形式this.$axios即可。

怎样将数据用表格显示

Element-ui的数据表格使用形式，可以直接将二维数组直接绑定到表格。中的data绑定到提供的二维数组的名字。，prop绑定二维数组中的键名，完成绑定即可自动形成表格。

源码如下：

Vue部分：

v-loading=”loading”

:data=”web_user_data”

height=”400″

@selection-change=”handleSelectionChange”

border