目录
一、页面引入方式:
组件的注册引入:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../node_modules/vue/dist/vue.js"></script>
<script src="../node_modules/jquery/dist/jquery.js"></script>
</head>
<script>
$(function () { //保证页面加载完后才加载js,不然#app会报错找不到
//组件定义
const login = {
template:"<h2>vue的使用</h2>"
}
var vm = new Vue({
el:"#app",
data:{},
components:{ //组件的注册
login
}
})
})
</script>
<body>
<div id="app">
//组件的使用
<login></login>
</div>
</body>
</html>
采用render函数来渲染组件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../node_modules/vue/dist/vue.js"></script>
<script src="../node_modules/jquery/dist/jquery.js"></script>
</head>
<script>
$(function () { //保证页面加载完后才加载js