vueプロジェクトの心得

1.初期化テンプレート
vue init webpack vue-music
2.フォルダに入るvue-music
npm install
3.stulesのインストール
npm install stylus stylus-loader --save-dev
 
(
 
devDependenciesとdependenciesの違い
npm installを使用してモジュールやプラグインをインストールする場合、packageに書き込む2つのコマンドがあります.jsonファイルには次のようなものがあります.
--save-dev
--save
packageでjsonファイルで提示されている違いは、--save-devを使用してインストールされたプラグインがdevDependenciesオブジェクトに書き込まれ、--saveを使用してインストールされたプラグインがdependenciesオブジェクトに書き込まれることです.
じゃあ...jsonファイルのdevDependenciesとdependenciesオブジェクトの違いは何ですか?
devDependenciesのプラグインは開発環境にのみ使用され、生産環境には使用されませんが、dependenciesは生産環境に公開する必要があります.
 
)
 
 
4.fastclickのインストール
npm install fastclick --save
5.babel-runtimeのインストール
npm install babel-runtime --save
 
6.
created:テンプレートがhtmlにレンダリングされる前に呼び出されます.つまり、通常、いくつかの属性値を初期化してから、ビューにレンダリングされます.
mounted:テンプレートがhtmlにレンダリングされた後に呼び出され、通常は初期化ページが完了した後、htmlのdomノードに必要な操作を行います.
7.stylusの文字&は親セレクタを指します.
2つのセレクタ(textareaおよびinput)は、:hoverの擬似クラスセレクタ上でcolor値を変更した.
 

textarea
input
  color #A7A7A7
  &:hover
    color #000

に等しい
 

textarea,
input {
  color: #a7a7a7;
}
textarea:hover,
input:hover {
  color: #000;
}

8.DOMを取りやすく、DOM refを操作しやすい
9.矢印関数
(1)パラメータを導入しない
 

var sum = () => 1 + 2;
//    ：
var sum = function() {    
    return 1 + 2; 
};

2、単一パラメータを導入する:

var reflect = value => value;
//    ：
var reflect = function(value) {    
    return value;
};

x => x * x
//   ：
function (x) { 
    

パラメータを直接書けばいいので、カッコをつけなくてもいいです.
 
3、複数のパラメータを導入する場合、括弧を付ける

var sum = (num1, num2) => num1 + num2;
//    ：
var sum = function(num1, num2) {    
    return num1 + num2;
 };

4、標準の関数体を使用したい場合、または関数内でより多くの文が実行される可能性がある場合は、カッコで関数体を囲み、戻り値を明確に定義します.

var sum = (num1, num2) => { return num1 + num2; }
//   ：
var sum = function(num1, num2) {    
  return num1 + num2; 
};

カッコ内の部分は基本的に従来の関数と同等です
5、矢印関数カスタムオブジェクトを返すには、そのオブジェクトを括弧で囲む必要があります.

var getTempItem = id = > ({
   id: id,
  name: "Temp"
});
//    :
var getTempItem = function(id) {
  return {
    id: id, 
    name: "Temp"
     };
};

括弧で括弧を含めると、関数本体ではなくオブジェクトの定義になります.
 
6. はVueの内蔵コンポーネントで、コンポーネントの切り替え中に状態をメモリに保持し、DOMの繰り返しレンダリングを防止します.