vue+element-ui中获取页面数据

https://blog.youkuaiyun.com/weixin_36706903/article/details/81706857

页面展示:

数据库字段名:

 

跨域:

config里的index文件里的dev里面的proxyTable里面添加自己的后台端口,这样就能很方便的请求后台数据了

'/api':{

target:'http://localhost:9987',

changeOrigin:true,

pathRewrite:{

'/api':''

}

<template>
 	<el-table :data="packData" border style="width: 100%">
                <el-table-column type="selection" width="55"></el-table-column>
                <el-table-column prop="PackingId" label="包装编号"  width="120">//prop里的值是数据库表里的对应字段名
                </el-table-column>
                <el-table-column prop="PackingName" label="包装名称" width="120">
                </el-table-column>
                <el-table-column prop="PackingPrice" label="包装价格" width="120">
                </el-table-column>
                <el-table-column prop="PackingImage" label="包装图片">
                </el-table-column>
            </el-table>
</template>
</script>
export default {
        name: 'pack',
        data() {
            return {
                packData:[],//主题数据
 
}}
methods:{
// 获取 包装数据,因为搜索后分页数据会变化,所以这里可以传值到后台判断是否进行了搜索展示,这里只做简单展示,不考虑搜索和分页
            getPackData() {
//我用的api代理
                this.$axios.post('/api/selectPackPageMade.do').then((res) => {
                    this.packData = res.data;//把传回来数据赋给packData
                }).catch(function(error){
                    console.log(error);
                })
            },}
}
</script>

 

转载于:https://my.oschina.net/u/3763385/blog/1928459

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值