Vue
关注
分享
扫一扫
文章平均质量分 50
昨日的某某
这个作者很懒，什么都没留下…
展开
-
开发时，改变数组或者对象的数据，但是页面没有更新如何解决？
1.对于数组：Vue 不能检测以下数组的变动：1.当你利用索引直接设置一个数组项时，例如：vm.items[indexOfItem] = newValue2.当你修改数组的长度时，例如：vm.items.length = newLength//举个例子：var vm = new Vue({ data: { items: ['a', 'b', 'c'] }})vm.items[1] = 'x' // 不是响应性的vm.items.length = 2 // 不是响应性.原创 2021-10-13 19:47:20 · 3346 阅读 · 0 评论 -
Vue美食节项目-----------菜谱详情页
1.点击菜单，跳转到菜谱详情页1.根据menuld请求数据，渲染页面注意数据结构过多，在保存到组件中时，提前写好默认值。避免在异步请求返回数据之前找不到数据<template> <div class="menu-detail"> <detail-header :info="menuInfo"></detail-header> <detail-content :info="menuInfo"></.原创 2021-10-12 20:02:34 · 990 阅读 · 0 评论 -
Vue美食节项目______显示美食空间
总体思路1.显示别人的空间 a.地址栏中如有userid则显示对应的用户数据2.显示自身空间a.如果没有userid则默认显示自己信息b.如果在菜谱中点击自己也是有userid传递c.通过判断是否为自己的如果是，不需要后端拿,登录时，个人信息3.代码展示<template> <div class="space"> <h2>欢迎来到我的美食空间</h2> ...原创 2021-10-08 20:37:04 · 175 阅读 · 0 评论 -
Vue中插槽的使用详解必看！
1.介绍插槽就是子组件中的提供给父组件使用的一个占位符，用<slot></slot> 表示，父组件可以在这个占位符中填充任何模板代码，如 HTML、组件等，填充的内容会替换子组件的<slot></slot>标签。通俗的说是：slot 是在父组建控制了子组件显示或隐藏相关内容。插槽又分为三种，1.普通插槽 2.具命插槽 3.作用域插槽1.普通插槽<divid="app"><my-button&...原创 2021-10-07 12:29:01 · 4851 阅读 · 0 评论 -
Vue中$nextTick的使用
参数： {Function} [callback] 用法：将回调延迟到下次DOM更新循环之后执行。在修改数据之后立即使用它，然后等待DOM更新。 它跟全局方法 Vue.nextTick 一样，不同的是回调的 this 自动绑定到调用它的实例上。 实例： <template> <p ref="msgp">{{msg}}</p> <button @click="change">$nextTick</button> </di原创 2021-10-04 15:11:39 · 328 阅读 · 0 评论 -
2021Web前端常见面试题总结
1.src和href的区别 ？Src用于替换当前元素，href用于在当前文档和引用资源之间确立联系.Src是source的缩写，指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置，请求src资源时会将其指向的资源下载并应用到文档内，例如js脚本，img图片混入frame等元素。Href是hypertext reference的缩写，指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的链接，如果我们在文档中添加<link href=”common.css” re原创 2021-10-04 14:50:02 · 517 阅读 · 0 评论 -
Vue路由传参query和params的区别
注意：使用query传参的时候，name,path都可以引入，但使用params传参的时候只能使用name进行引入。接收参数都是类似的，分别是this.$route.query.name和this.$route.params.name进行路由跳转的时候，我们使用this.$router.push（‘路径'）query更加类似于我们ajax中get传参，params则类似于post,前者在浏览器地址栏中显示参数，后者则不显示1.动态路由传参路由配置：{ path: '/...原创 2021-10-01 18:07:33 · 457 阅读 · 0 评论 -
Vue组件间通信方式(详解)
1. 组件之间的传值通信组件之间通讯分为三种: 父传子、子传父、兄弟组件之间的通讯(1)props/$emit父传子：父组件通过import引入子组件，并注册，在子组件标签上添加要传递的属性，子组 件通过props接收，接收有两种形式一是通过数组形式[‘要接收的属性’ ]，二是通过对象形式{ } 子传父：父组件向子组件传递事件方法，子组件通过$emit触发事件，回调给父组件1.父组件向子组件传值接下来我们通过一个例子，说明父组件如何向子组件传递值：在子组件Users.vue中如.原创 2021-09-28 10:57:36 · 2081 阅读 · 4 评论 -
Vue购物车案例（全选，反选，加入，删除，加减，总价，数量）
1.购物车效果图2.代码展示<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <style type="text/css"> body{ font-size: 16px; } table { width: 1200px; } ul l....原创 2021-09-22 19:09:59 · 10763 阅读 · 16 评论 -
Vue小黑记事本案例
1.小黑记事本效果图2.代码展示<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>小黑记事本</title> <style> *{ margin: 0 ; padding: 0; background-color: white; } .todo{ background-...原创 2021-09-22 18:53:02 · 628 阅读 · 2 评论 -
Vue项目小米购物车
1.vue小米购物车用到了 Vuex + localstorage，使用了vue2，创建项目用vue create xiaomi （名字）1.在Home.vue里面写<template> <div class="home"> <header> <span >首页</span> <router-link to="/about" class="span">购物车({{total...原创 2021-09-21 19:42:49 · 1457 阅读 · 4 评论 -
Vue面试题总结
#1.谈谈你对MVVM开发模式的理解MVVM分为Model、View、Viewmodel三者。 Model：代表数据模型，数据和业务逻辑都在Model层中定义； View：代表UI视图，负责数据的展开； ViewModel：负责监听Model中数据的改变并且控制视图的更新，处理用户交互操作； Model和View并无直接关联，而且通过Viewmodel来进行联系的，Model和Viewmodel之间有着双向数据绑定的联系。因此当Model中的数据改变时会触发View层的刷新，View中由于用户交互操作原创 2021-09-20 18:05:32 · 1445 阅读 · 3 评论