vant通过 CDN 引入实例

<!DOCTYPE html>

<html lang="zh">

<head>

<meta charset="UTF-8" />

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<meta http-equiv="X-UA-Compatible" content="ie=edge" />

<title>Document</title>

<!-- 引入样式 -->

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.1/lib/index.css">

<!-- 引入组件 -->

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>

<script src="https://cdn.jsdelivr.net/npm/vant@2.1/lib/vant.min.js"></script>

</head>

<body>

<div id="app">

<van-button type="default">默认按钮</van-button>

<van-button type="primary">主要按钮</van-button>

<van-button type="info">信息按钮</van-button>

<van-button type="warning">警告按钮</van-button>

<van-button type="danger">危险按钮</van-button>

</div>

</body>

<script>

var app = new Vue({

el: '#app',

data: {

},

methods: {

},

created() {

},

})

</script>

</html>



注意:首先注册组件,然后创建实例,否则报错;组件使用保持范围在实例容器里面生效。( cdn引入需要规范语法,闭合组件)




调用 Toast 提示时报错 Toast is not defined

Toast.success('抄底成功');

或者:this.$toast('提示)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容