More than 5 years have passed since last update.

Vue component

Vue.js

Last updated at 2020-01-04Posted at 2020-01-04

html

<html>
  <head>
    <meta charset="UTF-8"/>
  </head>
  <body>
    <div id="app">
      <button-counter></button-counter>
      <title1 title="タイトル"></title1>
    </div>

  <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
  <script>
      Vue.component('button-counter', {
        data: function () {
          return {
            count: 0
          }
        },
        template: '<button @click="count++">クリック数: {{ count }}</button>'
      });

      Vue.component('title1', {
        props: ['title'],
        template: '<h3>{{ title }}</h3>'
      });
      new Vue(
        { el: '#app' } );
    </script>
  </body>
</html>

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up