Rails + Vue : 인스턴스 변수에 액세스

Question

간단한보기가 있지만 Purchasebelongs to :client입니다. 따라서 purchases에 액세스하려면 client_id을 제공해야합니다. :

$(document).ready(function() { 
    var purchases = new Vue({ 
    el: '#purchases', 
    data: { 
     purchases: [] 
    }, 
    ready: function() { 
     var that; 
     that = this; 
     $.ajax({ 
     url: 'clients/' + CLIENT_ID + '/purchases.json', // problem 
     success: function(res) { 
      console.log(res) 
      that.purchases = res; 
     } 
     }); 
    } 
    }); 
}); 

어떻게 아약스 요청에 client_id 액세스합니까? 내가 <%= @client.id %>했는데 오류 undefined method id 'for nil : NilClass`가 표시됩니다.

어떻게 변수를 전달합니까?

Answer 1

질문에 대한 답은 js 함수에서 직접 인스턴스 변수에 액세스 할 수 없다는 것입니다. 이것은 js가 브라우저에서만 실행되는 클라이언트 측 언어이고 루비/레일은 서버 측 언어이기 때문입니다.

js에서 변수에 액세스 할 수있는 유일한 방법은 HTML 데이터로 전달하는 것입니다. 예를 들어 해당 html.erb 파일의 숨겨진 필드로 사용할 수 있습니다.

<%= hidden_field_tag('client_id', @client_id) %> 

하고 액세스하는 JS 파일

client_id: $('#client_id').val() 

있다.