mintui h5

2021-08-13  本文已影响0人  程序媛_

https://blog.csdn.net/weixin_44763569/article/details/90179772

this.$toast('Hello world!')

<!DOCTYPE html>

<html>

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

  <!-- 引入样式 -->

  <link rel="stylesheet" href="https://unpkg.com/mint-ui@1/lib/style.css">

  <style type="text/css">

  *{

margin: 0;

padding: 0;

}

.mint-header{

background-color: #FF0000;

}

  </style>

</head>

<body>

<!-- 滑动选项卡 -->

  <!-- <div id="app">

<mt-header fixed title="首页"></mt-header>

    <mt-button @click.native="handleClick">按钮</mt-button>

<mt-navbar class="page-part" :selected.sync="selected">

  <mt-tab-item id="1">选项一</mt-tab-item>

  <mt-tab-item id="2">选项二</mt-tab-item>

  <mt-tab-item id="3">选项三</mt-tab-item>

</mt-navbar>

<mt-tab-container :active.sync="selected">

  <mt-tab-container-item id="1">

    <mt-cell v-for="n in 10" :title="'内容 ' + n"></mt-cell>

  </mt-tab-container-item>

  <mt-tab-container-item id="2">

    <mt-cell v-for="n in 4" :title="'测试 ' + n"></mt-cell>

  </mt-tab-container-item>

  <mt-tab-container-item id="3">

    <mt-cell v-for="n in 6" :title="'选项 ' + n"></mt-cell>

  </mt-tab-container-item>

</mt-tab-container>

  </div> -->

  <div id="app"></div>

</body>

  <!-- 先引入 Vue -->

  <script src="https://unpkg.com/vue@1/dist/vue.js"></script>

  <!-- 引入组件库 -->

  <script src="https://unpkg.com/mint-ui@1/lib/index.js"></script>

  <script>

    new Vue({

      el: '#app',

  data:{

selected:'1'

  },

      methods: {

        handleClick: function() {

          this.$toast('Hello world!')

        }

      }

    })

  </script>

</html>

上一篇 下一篇

猜你喜欢

热点阅读