Laravel之vue操作

Laravel中balde模板引擎的分解符和vue的{{ }} 分解符產生沖突

解決辦法

使用vue的{{}}分解符的時候在前面加上@，@{{ }}，如下：

<button>@{{ message }}</button>

圖片沖突顯示

laravel balde模板，如下：

 <img :src="img_url" alt="" style="margin: auto;width:200px;height:200px;">

vue中data的數據，如下：

data:{
   'img_url':'圖片地扯',
},

發送請求

var params = new URLSearchParams();
 params.append("hzguid",hzguid); 
 params.append("times",times); 
 this.$axios({
     method: 'post',
     url: 'http://localhost:8080/TestS/queryStemp',
     contentType: 'application/x-www-form-urlencoded',
     data:params,  
 }).then(function(response) {
     console.log("data:"+response.data);
     console.log("status:"+response.status);
     console.log("statusText:"+response.statusText);
     console.log("headers:"+response.headers);
     console.log("config:"+response.config);
     console.log("list:"+response.list);
     console.log("response:"+response)
     var list = response.data
     console.log("傳遞的參數："+list)
     that.tableData = list
     console.log("table_data:"+that.tableData)
      }.bind(this)).catch(function (error) { 
           console.log(error);
      })

在使用axios時需要先引入插件

main.js
    import Axios from 'axios' 
    Vue.prototype.$axios = Axios