Vue
h_jQuery
这个作者很懒,什么都没留下…
展开
-
常用时间格式处理
时间格式处理原创 2023-03-16 14:26:55 · 196 阅读 · 0 评论 -
微信小程序发布流程初级
微信小程序发布原创 2023-02-08 17:58:49 · 173 阅读 · 0 评论 -
TS学习——第一天
typeScript原创 2023-01-16 11:54:32 · 168 阅读 · 0 评论 -
实时天气预报API——易客云API
实时天气预报API——易客云API原创 2023-01-10 11:35:37 · 1860 阅读 · 0 评论 -
Vue+Tinymce富文本编辑器
Vue+Tinymce富文本编辑器原创 2023-01-10 10:48:23 · 232 阅读 · 0 评论 -
vue-qr生成二维码并下载
vue-qr生成二维码并下载原创 2023-01-09 09:45:13 · 1049 阅读 · 0 评论 -
js处理——获取当前月第一天和最后一天
js时间处理原创 2022-12-29 16:43:25 · 2903 阅读 · 0 评论 -
vue组件封装——公用基础form组件
组件封装原创 2022-12-29 16:37:07 · 991 阅读 · 0 评论 -
vue组件封装——公用基础table组件
vue公用基础表格组件封装案例原创 2022-12-05 09:40:03 · 3653 阅读 · 3 评论 -
冒泡排序详解
冒泡排序原创 2022-11-03 14:43:35 · 267 阅读 · 0 评论 -
实现文件、压缩包下载——vue2
文件下载原创 2022-10-25 10:40:34 · 987 阅读 · 0 评论 -
文件上传——将文件转成base64传给后端
文件上传转base64原创 2022-10-25 10:02:57 · 4317 阅读 · 0 评论 -
实现elemen-ui的最后一行合计功能
table表格合计功能原创 2022-10-17 15:24:50 · 763 阅读 · 0 评论 -
git命令行学习二
git练习原创 2022-09-16 16:46:54 · 300 阅读 · 0 评论 -
vue项目SEO优化方案——prerender-spa-plugin插件实现预渲染
vue项目seo优化方案原创 2022-08-12 10:12:28 · 876 阅读 · 2 评论 -
日期时间选择器——el-date-picker设置默认时间
组件使用原创 2022-08-03 17:43:46 · 18419 阅读 · 3 评论 -
项目bug积累
bug集锦原创 2022-06-13 17:37:56 · 201 阅读 · 0 评论 -
ES6新特性——对象
es6原创 2022-05-25 11:38:40 · 422 阅读 · 0 评论 -
vue——插槽slot的学习与使用
Slot介绍:插槽就是子组件提供给父组件使用的一个占位符,用 表示,父组件可以向这个占位符中填充任何的自定义内容。1.普通插槽:具名插槽就正常使用,没有别的要求//父组件<mySon>//子组件里面有slot标签自定义的内容才有效<p>我是父组件</p></mySon>//子组件<div><p>我是子组件</p><slot>//父组件自定义的内容在这里面显示<p>如果原创 2022-05-09 16:44:33 · 269 阅读 · 0 评论 -
uniapp创建项目——vue3+vite
创建项目命令npx degit dcloudio/uni-preset-vue#vite my-vue3-project在创建新的页面时,会有模板选择。创建常用模板:在一下的目录下创建一个文件,将常用的模板放进去常用的vue3初始化模板<script setup>import { ref, toRefs, onMounted, reactive, defineProps } from 'vue'import { useRouter, useRoute } from 'vu原创 2022-04-12 21:57:51 · 1325 阅读 · 0 评论 -
vue项目创建——vue2/vue3
创建项目,vue2,vue3,vite原创 2022-04-07 15:51:53 · 1635 阅读 · 0 评论 -
vue3的时间积累
scss样式中背景图报错:报错的路径: background-image: url("@/assets/image/home/header-title.png");修改后的路径:在@前面加一个~ background-image: url("~@/assets/image/home/header-title.png");**~@**的意思: @是webpack设置的路径名,代表的是src目录,~ 是相对于下面的文件路径的意思...原创 2021-10-08 21:49:21 · 161 阅读 · 0 评论 -
ECMAScript——迭代器、生成器
ECMAScript迭代器迭代器(lterator)是一种接口,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署iterator接口(对象里面的属性),就可以完成遍历操作1.ES6创造了一种新的遍历命令for…of遍历,iterator接口主要供for…of消费2.原生具备iterator接口的数据(可用for of遍历) 2.1 Array 2.2 Arguments 2.3 Set 2.4 Map 2.5 String 2.6 TypedArray 2.7原创 2021-09-10 15:36:17 · 108 阅读 · 0 评论 -
ECMAScript——函数参数的默认值、rest参数、扩展运算符、Symbol
ECMAScript函数参数的默认值ES6允许给函数参数赋值初始值特性: 1.形参初始值,具有默认值的的形参,一般位置要靠后(潜规则) 2.可以与解构赋值一起使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <met原创 2021-09-10 10:21:57 · 205 阅读 · 0 评论 -
ECMAScript——let、const、解构赋值、模板字符串、对象的简化、箭头函数
ECMAScriptES全称EcmaScript,是脚本语言的规范,javascript就是es的一种实现,所以es的新特性就是js的新特性新特性的特点:1.语法简洁,功能丰富2.框架开发应用3.前端开发职位要求letlet是用来声明变量的特性:1. 变量不能重复声明2. 块级作用域(全局,函数,eval,在{}内)3. 不存在变量提升4. 不影响作用域链(内层没有,向外层寻找)<!DOCTYPE html><html lang="en"><h原创 2021-09-09 11:39:49 · 133 阅读 · 0 评论 -
vue3x——provide与inject、Composition API、Fragment、Teleport、Suspense
Vue3x5.provide与inject作用:实现祖孙组件间通信套路:父组件有一个provide选项来提供数据,子组件有一个inject选项来开始使用这些数据具体写法:1.父组件中:引用provide<template> <div class="app"> <p>我是App组件————祖组件</p> <p>数据:name:{{ name }}——————age:{{ age }}</p> <原创 2021-09-08 17:26:06 · 321 阅读 · 0 评论 -
vue3x——shallowReactive和shallowRef、readonly和shallowReadonly、toRaw与markRaw、customRef
Vue3.x其他CompositionAPI1.shallowReactive和shallowRef shallowReactive:只处理对象最外层属性的响应式(浅层响应式) shallowRef:只处理基本数据类型响应式,不进行对象的响应式处理 什么时候使用?: 如果有一个对象数据,结构比较深,但变化时只是最外层属性变化===>shallowReactive 如果有一个对象数据,后续功能不会修改该对象中的属性,而是生新的对象来替代====>shallowRef原创 2021-09-08 12:01:49 · 286 阅读 · 0 评论 -
vue3——computed、watch、watchEffect、生命周期、hooks、toRef
vue3.xcomputed函数与vue2中computed配置功能一致import { computed } from "vue";setup(){//简写 let test = computed(()=>{ return 1+1 })//完整 let demo =computed({ get(){ return 1+1 }, set(value){ value+1 } })}watch函数与Vue2.x中的watch配置功能一致监视的是原创 2021-09-07 18:05:39 · 783 阅读 · 2 评论 -
vue3.x——@vue/cli、vite、setup、ref、reactive
Vue31.性能的提升 1.1 打包带下减少41% 1.2 初次渲染快55%,更新渲染快133% 1.3内存减少54% …2.源码的升级 2.1 使用proxy代替defineProperty实现响应式 2.2重写虚拟dom的实现和Tree-Shaking …3.拥抱TypeScript 3.1 Vue3可以更好的支持TypeScript4.新的特性 4.1 Composition API(组合API) setup配置 ref与reactive原创 2021-09-07 16:02:00 · 445 阅读 · 0 评论 -
vue——编程式导航、路由守卫、路由的两种工作模式
编程式导航1.作用:不借助实现路由跳转,让路由跳转更加灵活2.具体编码:methods: { pushShow(v) { // 可以在外侧加个定时,这样就可以实现延迟跳转 // 追加一条记录 this.$router.push({ name: "zhanshi", query: { id: v.id, title: v.title }, }); }, replaceShow(v) { /原创 2021-09-06 09:38:04 · 260 阅读 · 0 评论 -
vue——路由、query、params、props、replace
路由1.路由就是一组key-value的对应关系2.多个路由,需要经过路由器的管理SPA:single page web application(单页面应用:只有一个html页面)vue-router:vue的一个插件,专门用来实现SPA应用对SPA应用的理解:1.单页面web应用2.整个应用只有一个完整的页面3.点击页面中的导航链接不会刷新页面,只会做页面的局部刷新4.数据需要通过ajax请求获取什么是路由路由就是一组映射关系(key-value),key为路径,value可能是fu原创 2021-09-01 18:08:45 · 513 阅读 · 0 评论 -
vuex案例
App.vue<template> <div> <Count /> <Person /> </div></template><script>import Count from "./components/Count.vue";import Person from "./components/Person.vue";export default { components: {原创 2021-09-01 10:09:58 · 135 阅读 · 0 评论 -
vue——vuex
Vuexvuex是什么?1.vuex的概念:专门在Vue中实现集中式状态(数据)管理的一个vue插件,对vue应用中多个组件的共享状态进行集中式的管理(读/写), 也是一种组件之间通信的方式,且适用于任意组件间通信2.Github地址:https://github.com/vuejs/vuex什么时候使用vuex?1.多个组件依赖于同一状态2.来自不同组件的行为需要变更同一状态先执行import,再执行其他的代码main.jsimport Vue from 'vue'import App原创 2021-09-01 10:05:31 · 190 阅读 · 0 评论 -
尚硅谷——TodoList案例最终版
TodoList案例目录main.jsimport Vue from 'vue'import App from './App.vue'// 关闭vue的生产提示Vue.config.productionTip = false;new Vue({ render: h => h(App), // 安装全局事件总线 beforeCreate() { // $bus相当于一个事件中心 Vue.prototype.$bus = this原创 2021-08-30 17:59:27 · 848 阅读 · 0 评论 -
vue——代理、插槽
配置代理1.xhr:new XMLHttpRequest()——xhr.open()配置请求信息、xhr.send()发送请求信息2.Jquey:.get、.get、.get、.post3.axios:通用的ajax请求库,官方推荐,使用广泛4.fetch5.vue-resource:vue插件库,vue1.0使用广泛,官方已不维护response.setHeader(‘Access-Control-Allow-Origin’,’*)设置代理方法一:在vue.config.js中添加以下配置原创 2021-08-30 17:50:44 · 290 阅读 · 0 评论 -
vue——$nextTick、动画、过渡
$nextTick语法:this.$nextTick(回调函数)作用:在下一次DOM节点更新结束后执行其指定的回调函数什么时候用:当改变数据后,要基于更新后的新DOM进行某些操作时,要在$nextTick所指定的回调函数中执行Vue封装的动画和过渡1.作用:在插入、更新或移除DOM元素时,在合适的时候给元素添加样式类名。2.写法: 2.1准备好样式: 元素进入的样式: 2.1.1 v-enter:进入的起点 2.1.2 v-enter-active:进入过程中(动画原创 2021-08-30 10:03:04 · 635 阅读 · 0 评论 -
vue——全局事件总线$bus、消息订阅与发布pubsub
全局事件总线(GlocalEventBus)1.一种组件间通信的方式,适用于任意组件间通信2.安装全局事件总线:new Vue({ ... beforeCreate(){ Vue.prototype.$bus=this //安装全局事件总线,$bus就是当前应用的vm }, ...})3.使用全局总线: 3.1 接收数据:A组件想接收数据,则在A组件中给$bus绑定自定义事件,事件的回调留在A组件自身methods:{ demo(msg){ console.log(msg原创 2021-08-27 11:33:02 · 898 阅读 · 0 评论 -
vue——webStorage、sessionStorage、localstorage、组件的自定义事件
webStorage1.存储内容大小一般支持5MB左右(不同的浏览器可能不一样)2.浏览器端通过window.sessionStorage和window.localStorage属性来实现本地存储机制3.相关API: 1.xxxxxStorage.setItem(‘key’,'value):该方法接受一个键和值作为参数,会把键值对添加到存储中,如果键名已存在,则更新其对应的值 2.xxxxxStorage.getItem(‘key’):该方法 接受一个键名作为参数,返回键名对应的值 3.x原创 2021-08-26 18:07:50 · 348 阅读 · 0 评论 -
尚硅谷—TodoList案例
1.组件化编码流程 1.1 拆分静态组件:组件要按照功能点拆分,命名不要与html元素冲突 1.2实现动态组件:考虑好数据的存放位置,数据是一个组件在用,还是一些组件在用 1.2.1 一个组件在用:放在该组件的data中即可 1.2.2 一些组件在:放在他们共同的父组件上 1.3实现交互:从绑定事件开始2.props适用于: 2.1父组件——>子组件 通信 2.2子组件——>父组件 通信(要求父组件先给子组件一个函数,然后子组件调用该函数,将数据当参数传给父元素原创 2021-08-26 11:03:26 · 789 阅读 · 0 评论 -
vue——mixin、插件、scoped、less-loader
mixin(混入)功能:可以把多个组件共用的配置提取成一个混入对象使用方式:第一步定义混合,例如://分别导出export const xxx ={ data(){.....}, methods:{......} .....}第二步:使用混入,例如:全局混入:Vue.mixin(xxx)(在main.js中引入)局部混入:mixins[‘xxx’](在export default {}里面引入,和data同级)mixins文件export const show = {原创 2021-08-25 18:03:36 · 212 阅读 · 0 评论