vue
关注
分享
扫一扫
Vue相关的内容
小兔崽崽！
我还年轻！！！
展开
-
Vue：插槽的理解与使用
vue插槽问题引入后备插槽具名插槽作用域插槽问题引入 在学习vue插槽的时候我们应当先知道什么是vue的父子组件。那在什么时候会用到插槽呢？当构建页面的时候，我们在父组件中引入子组件，但是引入子组件之后还是无法满足我们的需求，我们还希望在子组件中添加一点东西，这个时候我们就要用到插槽来分发内容。 首先定义一个myslot的子组件<template> <div> <p>我是子组件</p> </div></template原创 2021-12-20 23:07:23 · 813 阅读 · 1 评论 -
vuecli项目修改端口号
vue项目修改端口号首先在项目根目录建立一个vue.config.js文件然后在vue.config.js文件中写人以下代码module.exports = { devServer: { port: 8088 } }最后重新运行vuecli项目就可以了。原创 2021-10-04 14:20:59 · 1137 阅读 · 0 评论 -
Vue: @blur事件 实现注册用户时检验用户名是否可用
在vue中@blur 是当元素失去焦点时所触发的事件例子：在添加用户的时候，在输入用户名的时候要保证其用户名是唯一的，所有就要输入完用户名的时候，向后端发起请求，后端去查看数据库中是否存在该用户名，如果存在就要提醒用户该用户名已经存在，这个时候就可以用到blur来实现输入完用户名就开始校验。<tr> <td>用户名</td> <td> <input v-model="user.uname" @blur="checkNum()"/>原创 2021-09-06 18:55:45 · 3141 阅读 · 0 评论 -
Vue:路由传参
Vue:路由传参主要介绍params和query方法传参1.params形式传参<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>vue_22</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script原创 2021-08-29 20:00:51 · 162 阅读 · 0 评论 -
vue:组件之间的通信
vue:组件之间的通信1、子组件获取父组件数据在vue中，组件和组件之间是可以相互通信的，包括父子组件间，兄弟组件间都可以互相通信。1.子组件获取父组件 在vue中，组件实例的作用域是孤立的，默认情况下，父子组件的数据是不能共享的，也就是说，子组件是不能直接访问父组件的数据的。为此，vue给我们提供了一个数据传递的选项prop，用来将父组件的数据传递给子组件。具体使用如下：父组件给子组件传值的步骤：1、在js代码中创建子组件对象时，使用props来设置父组件调用子组件时的属性名（数组）；2原创 2021-08-23 23:30:01 · 355 阅读 · 1 评论 -
Vue：watch 监听器
watch 监听器在vue中，watch可以监听数据的改变。监听之后会调用一个回调函数。回调函数又两个参数1.更新后的值（也就是新值）2.更新前的值(旧值)1.简体基本数据类型下面使用watch来监听商品数量的变化。并且设置如果商品数量小于1，就重置成上一个值。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <scr原创 2021-08-23 22:13:54 · 195 阅读 · 0 评论 -
Vue：过滤器
过滤器:是对即将显示的数据做进一步的筛选处理，然后进行显示，值得注意的是过滤器并没有改变原来的数据，只是在原数据的基础上产生新的数据。全局过滤器下面定义一个全局过滤器，用于在数据前加上大写的VUE。需要注意的是，全局过滤器定义必须始终位于Vue实例之上，否则会报错。<div id="app"> {{message | toAdd}}</div><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"&原创 2021-08-21 11:16:18 · 374 阅读 · 0 评论 -
Vue: v-if 和 v-show的区别
v-if当v-if的值为false时，网页中将不会对此元素进行渲染<div id="app"> <div v-if="isShow">DOM元素的样式绑定</div></div><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><script> let vm = new Vue({ el: '#ap原创 2021-08-21 10:11:15 · 211 阅读 · 0 评论 -
MVVM框架
在认识MVVM框架前我们要先了解一下MVC架构1.MVC架构Model：数据模型，用来存储数据View：视图界面，用来展示UI界面和响应用户交互Controller：控制器，监听模型数据的改变和控制视图行为、处理用户交互优点：耦合性低；重用性高；生命周期成本低；部署块；可维护性高；有利软件工程化管理。2.MVVM框架MVVM框架分为三个部分：分别是M（Model，模型层 ），V（View，视图层），VM（ViewModel，V与M连接的桥梁，也可以看作为控制器）M：模型层，主要负责原创 2021-08-21 09:32:00 · 1442 阅读 · 0 评论