Mobile Platform as a Service:JS capabilities

If the card requires JS capabilities, you only need to write JS code in the <script> section of the template.

• Add the script to the vue file in the following format:

  <template>
      <div class="root">
          <text class="message" :value="message" @click="onClick()"></text>
      </div>
  </template>
  
  <script>
      export default {
          data: {
              message: 'Hello Cube 1'
          },
          beforeCreate() {
              this.message = 'Hello Cube 2'
          },
          didAppear() {
  
          },
          methods: {
                          // methods is a custom JS method inside and a card lifecycle method outside.
              onClick() {
                  console.info('invoke on-click event');
              }
          }
      }
  </script>
  
  <style>
      .root {
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          background-color: white;
          width: 100%;
          height: 400rpx;
      }
      .message {
          color: black;
          font-size: 50rpx;
      }
  </style>

• Print logs

  Currently, console.info, console.warn, and console.error are supported to print logs. For more information about the usage, see the preceding example.