create () {метод axios.get не работает при попытке отобразить содержимое из БД - PullRequest
Новая
       5

create () {метод axios.get не работает при попытке отобразить содержимое из БД

0 голосов
/ 25 октября 2018

** мой маршрутный файл, и когда я набираю непосредственно сообщения в URL, он показывает сообщения, но с созданным методом в app.js ничего не показывает **

Route::get('/posts', function () {
$posts_json = DB::table('posts')
->orderBy('posts.created_at','desc')->take(4)->get();return $posts_json;}

Мой файл app.js 

   const app = new Vue({
    el: '#app',
    data: {
    msg: 'make post',
    content:'',
    posts: [],
    bUrl: 'http://localhost/pathikhome',
    },
    ready: function(){
    this.created();
    },
    created(){
    axios.get(this.bUrl +'/posts')
    .then(response => {
    console.log(response); 
    this.posts = response.data;
    })
    .catch(function (error) {
    console.log(error);
    });   
    },

    methods: {
    addPost(){
    axios.post(this.bUrl +'/addPost', {
    content:this.content
    })

если не успех 

    .then(function (response) {
    console.log(response);
    })
    .catch(function (error) {
    console.log(error);
    });
    }
    }});

Ответы [ 2 ]

0 голосов
/ 25 октября 2018

ready больше не поддерживается.Это Vue v1.Ваш новый метод - mounted.См. https://vuejs.org/v2/guide/instance.html#Lifecycle-Diagram и https://vuejs.org/v2/guide/migration.html#ready-replaced

Кроме того, data - это функция, которая возвращает объект данных, поэтому, если она должна выглядеть следующим образом: 

data: function() {
   return {
      msg: 'make post',
      content: '',
      posts: []
  }
}
0 голосов
/ 25 октября 2018

удалить this.bUrl в URL вашей оси: 

created(){
    axios.get('/posts')
    .then(response => {

РЕДАКТИРОВАТЬ : попытаться удалить ready функция: 

ready: function(){
   this.created();
},

ваш data() должен иметь return внутри: 

data() {
    return{
        msg: 'make post',
        content:'',
        posts: [],
        bUrl: 'http://localhost/pathikhome',
    }
},
...