Vueベース

5294 ワード
vue JavaScript テキストリンク
まずhtmlファイルを作成した後
    <div id="app">
       {{ message }}
    </div>  
   var app = new Vue({
     el: '#app',
     data: {
       message: '안녕하세요!'
     }
})
このような簡単なテンプレート構文を使用して、DOMでデータを宣言的にレンダリングできます.
上のコードのようにDOM内部の内部文字は変更できますが、属性値は自由に変更できます.
   <div id="app">
      <input v-bind:type="type" :value="inputData"> 
      <a :href="gethshLink('@gga01075')">상혁이 블로그 사이트</a> 
   </div>
 <script>
         new Vue({
            el: '#app',
            data : {   //프로퍼티 
                inputData : 'hello',
                type : 'number',
                link : 'https://velog.io/',
            },
            methods : {  //메소드
                gethshLink(channel){
                    return this.link + channel;
                },
            }
         });
     </script>
上のコードのように<input>ラベルのtypeプロパティをスクリプトで接続したいです.次に、v-bind:プロパティ名=「property名またはメソッド名」と入力します.
そしてこれは<input :value="inputData"と略すことができます.メソッドのパラメータは、プロパティ値に含めることもできます.<a :href="gethshLink('@gga01075')">상혁이 블로그 사이트</a>のように、属性名=を「メソッド名(パラメータ)」として入れればよい.
[DB]認証と権限
Windows でツールを使わず Node.js の複数バージョンを共存させる