Vue Router ile Params Değişikliklerine Tepki Etmek için En İyi Uygulama

Question

Vue Router'ı /foo/:val gibi yollarla kullanırken, react for parameter changes'a bir gözlemci eklemeniz gerekir. Bu, URL'de parametrelere sahip tüm görünümlerde biraz rahatsız edici kod koduyla sonuçlanır.

Bu aşağıdaki örnekte gibi görünebilir: o aşmak için başka bir yolu

export default { 
    // [...] 
    created() { 
     doSomething.call(this); 
    }, 
    watch: { 
     '$route'() { 
      doSomething.call(this); 
     } 
    }, 
} 

function doSomething() { 
    // e.g. request API, assign view properties, ... 
} 

var mı? created ve $route için işleyicilerin değişiklikleri birleştirilebilir mi? Bileşenin yeniden kullanılması, izleyicinin hiç gerekli olmaması için devre dışı bırakılabilir mi? Vue 2 kullanıyorum ama bu da Vue 1 için ilginç olabilir.

Answer 1

GitHub issue sayesinde bulduğum olası bir cevap şudur.

Aynı zamanda v-for için kullanılan key attribute'u kullanmak, görünümde Vue parça değişikliklerine izin vermek içindir. Bu çalışması için, sen router-view elemana niteliğini eklemek zorunda: görüntülemeye bu ekledikten sonra

<router-view :key="$route.fullPath"></router-view> 

, artık $route izlemek gerekmez. Bunun yerine, Vue.js, bileşenin tamamen yeni bir örneğini oluşturacak ve ayrıca created geri çağrısını arayacaktır. Bununla birlikte, bu her şey ya da hiç bir çözüm değildir. Şu anda geliştirdiğim küçük uygulamada iyi çalışıyor gibi görünüyor. Ancak başka bir uygulamada performansa etkisi olabilir. Yalnızca bazı rotalar için görünümün yeniden kullanımını gerçekten devre dışı bırakmak isterseniz, key'un based on the route değerini ayarlamaya bakabilirsiniz. Ama ben bu yaklaşımı gerçekten sevmiyorum.