vue

VUE的生命周期

  • Post author:
  • Post category:vue

每一个vue实例从创建到销毁的过程，就是这个vue实例的生命周期。在这个过程中，他经历了从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程。那么这些过程中，具体vue做了些神马？ Vue 的生命周期总共分为8个阶段：创建前/后，载入前/后，更新前/后，销毁前/后。 1、beforeCreate（创建前） 表示实例完全被创建出来之前，vue 实例的挂载元素$el和数据对…

继续阅读 VUE的生命周期

Vue 3.0 响应式 计算和侦听 【Vue3 从零开始】

  • Post author:
  • Post category:vue

本节使用单文件组件语法作为代码示例 #计算值 有时我们需要依赖于其他状态的状态——在 Vue 中，这是用组件计算属性处理的，以直接创建计算值，我们可以使用 computed 方法：它接受 getter 函数并为 getter 返回的值返回一个不可变的响应式 ref 对象。 const count = ref(1)const plusOne = computed(() => count.val…

继续阅读 Vue 3.0 响应式 计算和侦听 【Vue3 从零开始】

《深入浅出webpack》学习7——vue项目（非cli）引入eslint检测

  • Post author:
  • Post category:vue

1.安装依赖：eslint 2.配置webpack.config.js： exclude忽略node_modules文件夹 enforce:将该检测放到其他loader之前，检测通过才会进入其他loader处理 3.根目录创建.eslintrc.js文件，配置： 4.启动npm run server（配置server在前面已整理过） 5.错误测试报错参考上节 版权声明：本文为qq_37246828…

继续阅读 《深入浅出webpack》学习7——vue项目（非cli）引入eslint检测

前端那么多好的框架 为什么springboot推荐使用Thymeleaf？前端那么多好的框架 为什么springboot推荐使用Thymeleaf,与vue,angularjs等相比 它值得用吗？

  • Post author:
  • Post category:vue

分类的话他们不是一种东西： 模板引擎：Thymeleaf、freemarker、JSP。 前端框架：vue、angularjs、jquery。 Thymeleaf是一个替代JSP的模板引擎，如果你只用静态页面+ajax的话可以不使用它。 同理，使用Thymeleaf或其他模板的时候也可以使用前端框架。

继续阅读 前端那么多好的框架 为什么springboot推荐使用Thymeleaf？前端那么多好的框架 为什么springboot推荐使用Thymeleaf,与vue,angularjs等相比 它值得用吗？

vue父组件向子组件传对象，不实时更新解决

  • Post author:
  • Post category:vue

思路1：就是让利用v-if的重新渲染机制 1.首先考虑的就是手动刷了，给组件加个v-if=”someShow“; 2.在父组件添加如下方法; // 这是组件上写法 ：<my-component v-if="someShow"></my-component> // 下边写在父组件的methods里 refesh:function(){ this.someShow=false;…

继续阅读 vue父组件向子组件传对象，不实时更新解决

Vue中img的src需要动态拼接字符串

  • Post author:
  • Post category:vue

如果不想导入require包裹，可以使用es6的语法 <img :src="`../${myImagePath}`"/> 版权声明：本文为weixin_51248307原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。原文链接：https://blog.csdn.net/weixin_51248307/article/details/128632339

继续阅读 Vue中img的src需要动态拼接字符串

vue实现点击li变色

  • Post author:
  • Post category:vue

利用v-for和v-bind实现点击li变色，由v-for遍历出内容和索引，点击li时传入index，判断遍历的index和点击的currentIndex相等时添加class属性，使其变色 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="vie…

继续阅读 vue实现点击li变色

[Vue] 最简单的网易云音乐播放器源码分享

  • Post author:
  • Post category:vue

分享一下最近制作的网易云播放器，实现了一些最为简易的功能 实现效果 播放音乐 播放mv 显示评价 首先需要配置网易云的api，需要本机安装 网易云音乐API链接 按照操作克隆本地，npm安装一下即可，非常简单 具体实现代码 <template> <div> <h1>Player</h1> <input type="text" v-model="…

继续阅读 [Vue] 最简单的网易云音乐播放器源码分享

vue3页面query参数变化并重新加载页面数据

  • Post author:
  • Post category:vue

一、业务场景 列表页携带id跳转到详情页，id发生变化重新加载当前页面。 跳转分两种情况，假设A页面是id为1111的详情页，B页面是id为2222的详情页。 第一种，A页面跳转到B页面，B页面返回时直接返回列表页。 第二种，A页面跳转到B页面，B页面返回时返回A页面，A页面再返回返回到列表页。 二、实现方式 核心方法：  $router.push     $router.replace  A页面…

继续阅读 vue3页面query参数变化并重新加载页面数据

VUE Object.assign()的使用

  • Post author:
  • Post category:vue

【ES6语法】 基本用法 Object.assign方法用于对象的合并，将源对象（source）的所有可枚举属性，复制到目标对象（target）。 const target = { a: 1 }; const source1 = { b: 2 }; const source2 = { c: 3 }; Object.assign(target, source1, source2); target /…

继续阅读 VUE Object.assign()的使用