vue 2.9一般的な操作テクニック

1544 ワード

一:urlアドレスバーパラメータの取得
例:/placeList?id=1;
this.$route.query.id  (id         )

二:次のページにオブジェクトを渡す(queryパラメータ)
父亲vue
this.$router.push({
    path:"/placeAdd",
    query:item
});
//path query    key 
//path:    
//query:       
//item:    

子vue
データを取得:this.$route.query.item
this.$route.query.item

3:親コンポーネントから子コンポーネントへの値の転送
父亲vue
/*     */



/*script
*showHover        */
this.$refs.chil.showHover("           ");


子vue
//             
methods: {
    showHover(text) {
     console.log(text)
    }
}

四:親要素のバブルイベントを阻止する

buttonのイベントaがトリガーされると、bイベントもトリガーされます
解決策:buttonに@clickを追加します.stop=「b」で、イベントのバブルを阻止します.

五:指定した配列オブジェクトidと同じ要素を削除する
arr.splice(arr.findIndex(item => item.id == id), 1)

六:オブジェクトのソート
    //          
    compare(property) {
      return function(obj1, obj2) {
        var value1 = obj1[property];
        var value2 = obj2[property];
        return value1 - value2; //   
      };
    }

七:数字タイプ+小数点しか入力できない
じゅんせいすう
onkeyup = "value=value.replace(/[^\d]/g,'')"

数値タイプ+小数点