Vue.js 安装

蓝奏云下载:

声明式渲染

  • el:用选择器找到对应的元素
  • {{xx}}:里面的数据对应着new出来的vue中的data的数据
	<div id="app">
	  {{ message }} {{name}}
	</div>
	
	<script type="text/javascript">
	var app = new Vue({
		el: '#app',
		data: {
			message: 'Hello Vue!',
			name : "Vue"
		}
	});
	</script>

在这里插入图片描述

使用v-bind绑定指令

<div id="app-2">
  <span v-bind:title="message">
    鼠标悬停几秒钟查看此处动态绑定的提示信息!
  </span>
</div>
var app2 = new Vue({
  el: '#app-2',
  data: {
    message: '页面加载于 ' + new Date().toLocaleString()
  }
})

在这里插入图片描述

css预处理器

在这里插入图片描述

idea安装vue插件

在这里插入图片描述
在这里插入图片描述

vue导包:vue cdn:百度or官网

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

v-bind:指令 绑定

在这里插入图片描述在这里插入图片描述

v-if,v-else,v-else-if 判断

在这里插入图片描述
在这里插入图片描述

v-for 遍历

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

事件–v-on

在这里插入图片描述
methods:加s的
在这里插入图片描述
在这里插入图片描述

vue7个常用属性

在这里插入图片描述

v-model:双向绑定

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

template:组件

在这里插入图片描述
在这里插入图片描述

axios:通信

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

计算属性

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

插槽slot

在这里插入图片描述

删除splice

加粗样式

自定义事件(不懂)

在这里插入图片描述
在这里插入图片描述

vue入门小结

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

安装node.js

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

第一个vue-cli应用

在这里插入图片描述
在这里插入图片描述

安装webpack

在这里插入图片描述
在这里插入图片描述

使用webpack

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

vue-router路由

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

运行

在这里插入图片描述

在这里插入图片描述在这里插入图片描述
在这里插入图片描述
在这里插入图片描述在这里插入图片描述
在这里插入图片描述在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

vue+elementui

在这里插入图片描述

在这里插入图片描述

Logo

前往低代码交流专区

更多推荐