初识Vue

最新推荐文章于 2024-01-03 09:19:25 发布

老于啊

最新推荐文章于 2024-01-03 09:19:25 发布

阅读量103

点赞数

文章标签： vue js

本文链接：https://blog.csdn.net/qq_43147591/article/details/112705885

版权

Vue.js 是目前最火的一个前端框架，React是最流行的一个前端框架（React除了开发网站，还可以开发手机App， Vue语法也是可以用于进行手机App开发的，需要借助于Weex）
Vue.js 是前端的主流框架之一，和Angular.js、React.js 一起，并成为前端三大主流框架！
Vue.js 是一套构建用户界面的框架，只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。（Vue有配套的第三方类库，可以整合起来做大型项目的开发）
前端的主要工作？主要负责MVC中的V这一层；主要工作就是和界面打交道，来制作前端页面效果；
框架：是一套完整的解决方案；对项目的侵入性较大，项目如果需要更换框架，则需要重新架构整个项目。

node 中的 express；

库（插件）：提供某一个小功能，对项目的侵入性较小，如果某个库无法完成某些需求，可以很容易切换到其它库实现需求。

1. 从Jquery 切换到 Zepto
1. 从 EJS 切换到 art-template

具体配置vue的过程
(1）首先在自己的项目里面引入vue.js
（2）新建new vue()
(3)使用el和data来指定自己要操作的div

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../code/lib/vue-2.4.0.js"></script>
</head>
<body>
    <div id="app">
        <p>{{msg}}</p>
    </div>
    <script>
       var vm = new Vue({
            el:'#app',
            data:{
                msg:"welcome to vue"
            }
        })
    </script>
</body>
</html>

重要vue标签的含义
1.首先是{{text}}使用此标签可以显示自己定义的内容
2.v-cloak可以解决插值表达式闪烁的问题
3.v-text和插值表达式功能类似，都是在div里面显示自己定义的内容，但是v-text没有闪烁问题，并且会覆盖之前的内容（占位符）
4.v-html可以转义自己写的内容
5.v-bind可以绑定自己的数据（绑定属性） v-bind == ：即可以简写
6.v-on:click绑定事件机制，然后在methods:里面定义自己的方法
v-on:mouseover鼠标移动到按钮上就出发事件
v-on缩写为@click
7.获取Vue内部自定义的数据一般是使用this关键字获取
8.截取字符串this.msg.substring(0,1) 0表示从第一个字符串截取，截取一个字符
9.锥子函数

setInterval( () =>{
                      var start = this.msg.substring(0,1)
                      var end = this .msg.substring(1)
                      this.msg = end + start
                  },400)

10使用@click.stop可以阻挡冒泡的方法调用
@click.prevent 可以阻止默认行为，可以阻止所有人的
@click.capture 可以出发捕获事件，从外往里执行
@click.self 点击谁就执行谁，只会阻止自己的，不会阻止其他人的
@click.once只会出发一次默认事件
11v-model可以实现双向数据绑定在这里插入图片描述
12 eval（参数）函数将参数转换成数字，这是一种投机取巧
13 v-for 使用<p v-for="(item,i) in list">{{i}}----{{item}}</p>
获取对象的下标和内容，也可以是复杂数据类型

老于啊

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
初识Vue

Vue.js 是目前最火的一个前端框架，React是最流行的一个前端框架（React除了开发网站，还可以开发手机App， Vue语法也是可以用于进行手机App开发的，需要借助于Weex）Vue.js 是前端的主流框架之一，和Angular.js、React.js 一起，并成为前端三大主流框架！Vue.js 是一套构建用户界面的框架，只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。（Vue有配套的第三方类库，可以整合起来做大型项目的开发）前端的主要工作？主要负责MVC中的V..
复制链接

扫一扫