前言
随着编程技术的不断发展,前端开发也越来越重要,很多人都开启了前端的学习,本文就介绍了前端开发的框架之一vue.js的基础内容。
一、Vue.js是什么?
vue.js是一个框架,目前来说是比较火的框架, Vue.js 是前端的主流框架之一,和Angular.js、React.js 一起,并成为前端三大主流框架!Vue.js 是一套构建用户界面的框架,只关注视图层,它不仅易于上手,还便于与第三方库或既有项目整合。(Vue有配套的第三方类库,可以整合起来做大型项目的开发)
- 前端的主要工作?主要负责MVC中的V这一层;主要工作就是和界面打交道,来制作前端页面效果;
二、 为什么要学习流行框架?
1.企业中
- 企业为了提高开发效率:在企业中,时间就是效率,效率就是金钱;
- 企业中,使用框架,能够提高开发的效率;
1.如何使用vue.js框架?
在script中引用一个vue.js插件就行
<script src="../../js/vue-2.4.0.js"></script>
2.那vue.js的基本结构是什么呢?
代码如下(示例):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="../js/vue.js"></script>
</head>
<body>
<div id="x">
<p>{
{
m1}}</p>
</div>
<script type="text/javascript">
var m =new Vue({
el:'#x',
data: {
m1: '这是第一个vue.js'
},
methods: {
}
}
})
</script>
</body>
</html>
该处引用了一个vue.js插件,创建了一个vue的对象m,
vue中el:’#x’的对应html中的div的id,你可以将定义的常量,变量等数据放入data中,div中如何引用数据呢,直接{
{}}就行;
总结
今天是学习vue.js的第一天,总体来说vue.js够简洁,
很多东西直接调用就行,比较容易上手吧,明天继续加油!!