Vue
文章平均质量分 73
vue的知识点
?abc!
努力学习,天天向上
展开
-
vue + axios + promise:进行接口请求。post请求提交数据的三种方式
这三种状态不受外界影响,而且状态只能从pending改变为resolved或者rejected,并且不可逆pending: 等待中,或者进行中,表示还没有得到结果resolved: 已经完成,表示得到了我们想要的结果,可以继续往下执行rejected: 也表示得到结果,但是由于结果并非我们所愿,因此拒绝执(用catch捕获异常)不管是then或者catch返回的都是一个新的Promise实例!原创 2023-05-31 06:15:00 · 3421 阅读 · 0 评论 -
vue 使用v-if切换输入框时,导致输入框的数据内容没有清空
如果是对加了表单验证的元素进行显示隐藏,当使用 v-show 时,元素隐藏了,但是表单验证依旧存在,valid 永远返回 false。,那便是:添加一个具有唯一值的 key 属性。如果代码中使用上述的进行输入框的切换,由此,vue提供一种方式来表示。原创 2023-05-30 06:15:00 · 1844 阅读 · 0 评论 -
vue避免变量在不同情况赋值后重复影响(即避免双向绑定)
如或者是,这种情况会导致这里有两种方法去解决。原创 2023-05-29 20:17:16 · 1887 阅读 · 1 评论 -
el-dialog弹窗表单使用 destroy-on-close 无效(不能将数据和验证情况)的bug解决
在使用el-dialog时,需要将弹窗里面的表单内容及校验规则清空,查询了element-ui发现了方法不能将数据等清空。原创 2023-05-29 20:16:04 · 3987 阅读 · 0 评论 -
Element的使用
Element :网站快速成型工具。是饿了么公司前端开发团队提供的一套基于Vue的网站组件库。使用Element前提必须要有Vue。组件:组成网页的部件,例如超链接、按钮、图片、表格等等~Element官网: https://element.eleme.cn/#/zh-CN效果:Element入门下载Element核心库。引入element-ui这个文件夹,直接将这个文件夹复制到过程中引入Element样式文件。<link rel="stylesheet" hre原创 2021-10-24 10:21:37 · 4178 阅读 · 0 评论 -
Vue组件:组件的使用、组件间的通信
组件的使用为什么使用组件:使用组件可以提高vue中模板代码的复用率和灵活性可以将通用或者公用的页面模块抽取成vue组件,在vue实例中引用。避免重复多次编写往往不同的页面,也会有相同的部分。例如网站可能会有相同的头部导航。把页面的不同部分拆分成独立的组件,然后在不同页面就可以共享这些组件,避免重复开发。全局组件通过Vue的component方法来定义一个全局组件。全局组件:在所有的vue实例中都可以使用组件注:组件其实也是一个Vue实例,因此它在定义时也会接收:data、me原创 2021-10-24 10:21:07 · 215 阅读 · 0 评论 -
axios实现异步请求
ajaxVuejs 并没有直接处理ajax的组件,但可以使用axios或vue-resource组件实现对异步请求的操作。使用axios或vue-resource组件实现对异步请求的操作。vue-resourcevue-resource是Vue.js的插件提供了使用XMLHttpRequest或JSONP进行Web请求和处理响应的服务。 当vue更新到2.0之后,作者就宣告不再对vue-resource更新,而是推荐axios。axiosAxios 是一个基于 promise 的 HTTP原创 2021-10-23 09:31:06 · 8862 阅读 · 0 评论 -
Vue指令(3):v-bind、计算属性、watch(监控)与深度监控
v-bind(操作属性值)在属性上使用vue的数据通过插值的方式并不能实现属性的替换,所以使用v-bind插值表达式不能用在标签的属性中。于是使用新的指令来解决:v-bind语法:v-bind:属性名="Vue中的变量"可以简写为::属性名='属性值'例如:<div v-bind:class="color"></div>//与下面这个效果一样<div :class="color"></div>测试代码:<!DOC原创 2021-10-23 09:30:42 · 508 阅读 · 0 评论 -
Vue指令(2):v-for、v-if与v-show
v-for(遍历数据)v-for:遍历数据渲染页面遍历数组语法:v-for="item in items"items:要遍历的数组,需要在vue的data中定义好。item:循环变量示例:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>测试</title> <script src="node原创 2021-10-22 09:40:56 · 382 阅读 · 0 评论 -
Vue指令(1):插值({{}}、v-text和v-html)、v-model、v-on
指令指令 (Directives) :是带有 v- 前缀的特殊属性。例如在入门案例中的v-model,代表双向绑定。插值表达式插值:使用在有需要显示vue实例数据的地方可以在插值表达式中调用实例的数据属性和函数。花括号({})格式:{{表达式}}说明:该表达式支持JS语法,可以调用js内置函数(必须有返回值)达式必须有返回结果。例如 1 + 1,没有结果的表达式不允许使用,如:var a = 1 + 1;可以直接获取Vue实例中定义的数据或函数例子:<!DOCTYP原创 2021-10-22 09:40:02 · 2908 阅读 · 1 评论 -
Vue实例(2)生命周期详解与钩子函数
生命周期钩子生命周期每个 Vue 实例在被创建时都要经过一系列的初始化过程:创建实例,装载模板,渲染模板等。Vue为生命周期中的每个状态都设置了钩子函数(监听函数)。每当Vue实例处于不同的生命周期时,对应的函数就会被触发调用。钩子函数,不能使用箭头函数来定义一个生命周期方法例如 :created: () => this.fetchTodos()因为箭头函数的this与我们期望在钩子函数里面的this不一样钩子函数的this,我们期望他是代表当前的Vue实例的原创 2021-10-21 11:00:12 · 406 阅读 · 0 评论 -
Vue实例(1)创建、模板、数据和方法
入门演示1.创建页面,初始化vue;2.{{}}获取显示数据;<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>测试</title> <script src="node_modules/vue/dist/vue.js"></script></head><body>原创 2021-10-21 10:58:29 · 891 阅读 · 0 评论 -
Vue安装
Vue的下载安装使用IDEA创建示例工程并在工程中通过npm安装下载vue.jsvue是一个前端框架,其实也是一个js文件。只需要下载vue.js文件,并在页面中引入该js文件就可以了。vue.js的下载方式:可以引用在线的vue.js;可以离线下载vue.js;npm包资源管理器,可以下载vue.js使用npm进行安装第一步:新建一个Project,我这里新建的是一个静态工程安装npm......原创 2021-10-20 18:58:18 · 641 阅读 · 0 评论 -
window10安装npm并进行配置的详细步骤,傻瓜式操作-----Node.js
1.下载npm官网下载我是在window下安装,电脑是64位的所以按下面的选择安装包下载完成2.安装node1.双击2:按如下操作3:按如下操作4:选择安装目录,点击下一步5点击next,其互自动添加环境变量6.接下来一直是“next”,直到最后点击finish7.查看各个文件的目录8.查看是否安装正常9.配置npm的全局模块的存放路径和cache的路径在之前安装的目录下面新建两个文件node-cache,node-global用来指定npm的模块路径和缓存路原创 2021-10-19 12:25:31 · 12210 阅读 · 0 评论 -
Vue(1)概述
前端开发模式的发展静态页面开发人员只需要关心页面的样式和内容:HTML异步刷新,操作DOMJavaScript的诞生使开发人员可以操作DOM元素和样式,页面有一定的动态效果,还是以静态为主ajax的盛行,使开发人员不仅仅要编写HTML样式,还要懂ajax与后端交互,然后通过JS操作Dom元素来实现页面动态效果。例如:JQuery框架MVVM,关注模型和视图例如下面的这些前端框架框架架构最初发布时间KnockoutMVVM2010.7Ba原创 2021-10-18 20:16:41 · 107 阅读 · 0 评论