開発者ドキュメント

Vue.jsのHelloWorld

Vue.js は、リアクティブコンポーネントのライブラリとして急速に人気のあるオプションになりつつあります。 軽量で、把握しやすく、楽しく遊ぶことができ、ReactやAngularなどの他のライブラリの優れた代替手段になる可能性があります。

最も簡単な例で足を濡らしてみましょう。 これが基本的なHelloWorldアプリのコードで、興味深い部分が強調表示されています。

<!DOCTYPE html>
<html lang="en">
  <meta>
    <meta charset="UTF-8">
    <title>Hello World in Vue.js</title>
  </meta>

  <body>
	
    <div id="hello-world-app">
      <h1>{{ msg }}</h1>
    </div>

    <script
      src="//cdnjs.cloudflare.com/ajax/libs/vue/2.1.6/vue.min.js">
    </script>

    <script>
      new Vue({
        el: "#hello-world-app",
        data() {
          return {
            msg: "Hello World!"
          }
        }
      });
    </script>

  </body>
</html>

ステップバイステップの内訳:

これで、この簡単な紹介は終わりです。 詳細については、Vue.jsの公式ガイドのはじめにのセクションをご覧ください。

モバイルバージョンを終了