如何从Laravel将路由参数传递给Vue.js

时间:2016-03-16 02:11:17

标签: laravel laravel-5 vue.js

我有这样的路线来获取带有相关评论的帖子。

Route::get('/api/topics/{category_id}/{title}', function($category_id, $title){
    return App\Topic::with('comments')->where(compact('category_id','title'))->firstOrFail();
});

问题是如何将参数变量传递给Vue.js?在本例中为“category_id”和“title”,因此Vue可以获取帖子以及评论。

下面是我的Vue实例,它给了我这个错误:

main.js:11749Uncaught ReferenceError: category_id is not defined

Vue实例

new Vue({


el: '#comment',

methods: {

    fetchComment: function (category_id, title) {
        this.$http.get('/api/topics/' + category_id + '/' + title ,function (data) {
            this.$set('topics',data)
        })
    }


},
ready: function () {
    this.fetchComment(category_id, title)
}
}); 

显示某个帖子的方法

public function show($category_id, $title)
{

$topic = Topic::where(compact('category_id','title'))->firstOrFail();

$comments = Comment::where('topic_id',$topic->id)->get();

return view('forums.category', compact('topic','comments'));
}

1 个答案:

答案 0 :(得分:2)

ForumsController.php

var category_id = '{{ $topic->cataegory_id }}';
var title       = '{{ $topic->title }}';

new Vue({
  el: '#comment',

  methods: {
    fetchComment: function(category_id, title) {
      this.$http.get('/api/topics/' + category_id + '/' + title, function(data) {
        this.$set('topics', data);
      })
    }


  },

  ready: function() {
    this.fetchComment(category_id, title);
  }
});

的Javascript

Sub Macro1(numRows As Long)
  Dim a As Long, i As Long, rng As Range
  Windows("sample rnd.xlsm").Activate
  a = Int(Rnd() * 5213) + 2
  Set rng = Range("A1:L1")

  For i = 1 To numRows
    While Not Intersect(Cells(a, 1), rng) Is Nothing
      a = Int(Rnd() * 5213) + 2
    Wend
    Set rng = Union(rng, Range("A1:L5215").Rows(a))
  Next

  rng.Copy
  Sheets("Random Sample").Range("A1").Select
  ActiveSheet.Paste
End Sub