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>
网友评论