vue
文章平均质量分 52
学习vue时遇到的问题总结
熬夜梦想家
弹钢琴的的程序媛
展开
-
深入学习keepalive
keepalive是我们在vue项目中经常使用的一个功能,可以让页面数据暂时缓存,不过他是如何缓存的?如何保持数据不更新的?概念:“keep-alive”包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。和“transition”标签相似,都是抽象组件:它自身不会渲染一个DOM元素,也不会出现在父组件链中。当组件在"keep-alive"内被切换的时候,它的activated和deactivated这两个生命周期钩子函数将会被对应执行。主要用于保留组件状态或避免重新渲染。属性:inclu原创 2021-11-03 11:05:54 · 264 阅读 · 0 评论 -
一看就会!vue中nexttick是个嘛?
官方定义:在下次Dom更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的DOM。场景:在给子组件传参上;我们给子组件传参数后,在子组件中调用函数查看参数。<div id="app"> <div class="msg"> <form-report ref="child" :name="childName"></form-report> </div></div>Vue.c原创 2021-10-18 20:37:16 · 201 阅读 · 0 评论 -
框架el-admin学习总结(二)----浅学
今天给组员和要学习这个框架的同学,进行了入门级的讲解。第一次讲课,感觉准备不足,而且整体讲课框架还有些问题,有些细节甚至自己都没有了解透。所以这次还有有很多问题的。接受自己的问题,并在以后改正,加油eladmin学习总结一,Login:整体逻辑:1. // 获取验证码 // 获取用户名密码等Cookie //判断 token 过期是否知识点:1.v-on事件修饰符:*prevent:*@click.prevent —阻止跳转行为 self:------原创 2020-11-30 22:35:21 · 1291 阅读 · 0 评论 -
在父组件控制子组件的加载
在写科研管理项目的时候,遇到了一个问题,需求是这个鸭子是子组件需要从父组件中获取接口请求到的数据,同时需要每次进入父组件的页面时,这个数据都是从接口拿到的最新的数据。发现问题,发现每次通过面包屑点开父组件,然后进入其他页面,再重新进入这个父组件时,希望子组件的数据是更新后的,从而控制一些样式改变。会发现每次拿到的都是原来的数据。从控制台输出也发现,父组件接口请求到数据总是比渲染子组件晚。(因为接口请求是异步的原因)问题解决所以要想每次进入这个父组件页面都让子组件获得最新的数据,就需要等接口原创 2020-11-24 21:05:50 · 1027 阅读 · 0 评论 -
Vue知识:动态设置样式style、class
对象语法:绑定单个class:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> div{ width:200px;height:30px;margin: 100px; } .active1{原创 2020-10-24 16:20:03 · 814 阅读 · 0 评论 -
vue中$router的接受传递参数--query和params区别
1.query方式传参和接收参数传参: this.$router.push({ path:'/xxx' query:{ id:id } }) 接收参数:this.$route.query.id2.params方式传参和接收参数传参: this.$router.push({ name:'xxx' params:{ id:id } }原创 2020-10-19 21:29:39 · 216 阅读 · 0 评论 -
微信公众号无感登录总结
最近在做一个小的公众号项目,在写无感登录的时候卡了三四天,终于学长给了一趟思路,捋通了。具体思路如图:原创 2020-10-02 11:02:07 · 1340 阅读 · 2 评论 -
VUE父子组件传值
父传子父组件:<template> <div> //这里调用子组件 <sex @listenChildEvent="sexMsg" ></sex> </div></template>script代码:import Sex from "../components/Sex.vue";export default { components: { Sex }, data()原创 2020-09-26 18:04:48 · 118 阅读 · 0 评论 -
Vue底层的api——render函数的基本概念和用法
Vue 推荐在绝大多数情况下使用模板(template)来创建你的 HTML。然而在一些场景中,你真的需要 JavaScript 的完全编程的能力。这时你可以用渲染函数,它比模板更接近编译器。平时我们写真实的DOM结构,可以用html编写一个文档,然后提交给浏览器解析成我们想要的页面。同时也可以通过DOM 的api innerHTML告诉浏览器结构是什么,还可以用createElement来构建DOM树,以hello world为例,html和innerHTML api 对DOM结构的描述都是“<h原创 2020-08-22 15:40:22 · 789 阅读 · 0 评论 -
vue响应式原理
原创 2020-02-23 16:44:38 · 99 阅读 · 0 评论 -
nginx项目在window下部署
首先下载Nginx,尽量下载stable版本,较稳定然后解压,把html中的网页删除,改为我们自己项目的dist文件原创 2020-02-23 15:36:18 · 419 阅读 · 1 评论 -
VUE笔记--详情页跳转以及制作
详情页跳转以及制作1.详情页跳转利用router来进行页面的跳转,配置详情页的路由,eg:/detail:iid从首页获取到每个小goodsitem的iid,从而跳转到其相应的详情页,进而获得相应的详情信息。2.Bug1 解决从其他页面返回到首页,保存首页的停留位置查看在整个app中有没有使用keep-alive设置一个变量y值,通过activated()和deactivated...原创 2020-02-23 15:17:16 · 2635 阅读 · 0 评论 -
【解决】使用Better-Scroll时的页面无法向上滚动的bug
在做一个商城实践中,图片总是上拉一段距离后就拖不动,这是跟Better-Scroll内部加载图片机制有关的我的图片是在GoodsItemList这个组件中写的,如果要是页面滚动正常,就需要让srollheight等于所有要加载图片的高度,所以这里就应该在每次加载一张图品后重新就计算一遍scrollheight,就要用better-scroll中的refresh()方法。具体操作:首先Goo...原创 2020-02-12 15:40:44 · 1692 阅读 · 0 评论 -
【解决方法】'webpack-dev-server' 不是内部或外部命令,也不是可运行的程序
我的步骤:我没有找到node_modules”文件夹,所以直接在项目目录下: npm install;或者用cnpm installnpm run build;npm run dev 成功后等几秒自动打开了localhost:8080另外: 很久之前安装的node是需要升级的, 项目package.json中有最低版本的要求,所以要注意!...原创 2020-01-19 16:21:56 · 193 阅读 · 0 评论 -
webpack用npm安装失败的解决方法
在cmd进行webpack安装的时候安装失败,显示了error!警告的句子解决办法就是,使用淘宝npm镜像。$ npm install -g cnpm --registry=https://registry.npm.taobao.org在黑窗口执行这个语句等执行完后,就可以通过cnpm 来安装我们的webpack,例如,我们需要安装3.6.0版本的$ cnpm install webp...原创 2020-01-15 09:59:58 · 1856 阅读 · 0 评论