只是记录,初心是为了让页面更好看,会有错误
环境准备
下载vue:Vue下载
下面两个是可选的,主要是我想让控制台干净点
vue_dev_tool安装 vue_dev_tool安装
: Vue 控制台出现You are running Vue in development mode. Make sure to turn on production mode when deploying for production
第一个程序
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="../js/vue.js" type="text/javascript"> </script>
</head>
<body><!-- html:5快速生成 --><div id="display">欢迎来到{{name}}的网站<!-- {{name}}是插值表达式,在data中找名为name的键所对应的值 --></div><script type="text/javascript">Vue.config.productionTip = false// new Vue({})的{}是一个配置对象new Vue({el:"#display",//el是element的缩写// #display是通过id选择器来绑定,通常是使用id选择器,下面的几种要认识// 通过类选择器来绑定:把#display换成.display即可// document.getElementById("display") data:{name:"矽疑"}})</script>
</body>
</html>