2015-11-10 17 views
10

Nói rằng tôi có một trường hợp Vue như vậy:Trong Vue JS, gọi một bộ lọc từ một phương pháp bên trong dụ vue

new Vue({ 
    el: '#app', 

    data: { 
     word: 'foo', 
    }, 

    filters: { 
     capitalize: function(text) { 
      return text.replace(/(?:^|\s)\S/g, function(a) { return a.toUpperCase(); }); 
     } 
    }, 

    methods: { 
     sendData: function() { 
      var payload = this.$filters.capitalize(this.word); // how? 
     } 
    } 
} 

tôi có thể dễ dàng sử dụng các bộ lọc trong một khuôn mẫu như vậy:

<span>The word is {{ word | capitalize }}</span> 

Nhưng làm cách nào tôi có thể sử dụng bộ lọc này từ bên trong một phương thức thể hiện hoặc thuộc tính được tính? (Rõ ràng ví dụ này là tầm thường và các bộ lọc thực tế của tôi phức tạp hơn).

Trả lời

0

Để bổ sung cho Morris câu trả lời, đây là một ví dụ về một tập tin tôi thường sử dụng để đặt các bộ lọc bên trong, bạn có thể sử dụng trong bất kỳ quan điểm sử dụng phương pháp này.

var Vue = window.Vue 
var moment = window.moment 

Vue.filter('fecha', value => { 
    return moment.utc(value).local().format('DD MMM YY h:mm A') 
}) 

Vue.filter('ago', value => { 
    return moment.utc(value).local().fromNow() 
}) 

Vue.filter('number', value => { 
    const val = (value/1).toFixed(2).replace('.', ',') 
    return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.') 
}) 
Vue.filter('size', value => { 
    const val = (value/1).toFixed(0).replace('.', ',') 
    return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.') 
}) 
Các vấn đề liên quan