あなたの可愛い41

最近也学习了一段时间了，之前都是写,所以在这个过程中难免就会有一些比较。我也就是一激灵，的其实蛮神奇的,那有吗？因为我们在组件的里面放了一个，所以这个位置会空出来用来放输入的插槽内容,那么这个就会被接收OK!那么现在，我们就对有一个初步的认识了，那么，可以有多个插槽吗？我们再写一个组件方便来调用具名插槽在中调用如下:是的缩写匿名插槽可以不写直接用的从React的角度来认识我们先看一下React支不支持上面操作你会发现按钮萎缩了，是的，...

vue2和vue3封装echarts的比较vue2封装echarts无法监听到option的变化添加一个echarts_data数据监听来解决问题vue3封装echarts使用deep:true深度监听直接解决问题总结附录：代码B站视频地址vue2app.vueecharts.vuevue3app.vueecharts.vuevue2封装echarts无法监听到option的变化我们在组件里面把option写成props，然后watch。我们在app.vue中通过button改变传入的option

Vue3学习笔记provide与injectFather.vueSon.vueGrandSon.vue补充：响应式数据的判断一些新组件provide与inject实现跨层级组件(祖孙)间通信父组件provide const color=ref('red') // 提供数据 provide('color',color)孙组件inject const color=inject('color')Father.vue<!-- * @Author

Vue3学习笔记toRaw与markRawtoRawmarkRaw完整代码toReftoRaw与markRawtoRaw返回由reactive或readonly方法转换成响应式代理的普通对象这是一个还原方法，可用于临时读取，访问不会被代理/跟踪，写入时也不会触发界面更新markRaw标记一个对象，使其永远不会转换为代理。返回对象本身应用场景有些值不应该被设置为响应式的，例如复杂的第三方实例或Vue组件对象当渲染具有不可变数据源的大列表时，跳过代理转换可以提高性能

学习笔记shallowReactive与shallowRefreadonly与shallowReadonlyshallowReactive与shallowRefshallowReactive：只处理了对象内最外层属性的响应式(也就是浅响应式)shallowRef：只处理了value的响应式。不进行对象的reactive处理。什么时候用浅响应式呢？一般情况下使用ref和reactive即可如果有一个对象数据，结构比较深，但变化时只是外层属性变化，我们可以用shallowReactive如果有

Vue3学习笔记toRefs在写hook的时候经常用到这个补充：ref的另一个作用toRefs把一个响应式对象转换成普通对象，该普通对象的每个property都是一个ref应用：当从合成函数返回响应式对象时，toRefs非常有用，这样消费组件就可以在不丢失响应式的情况下对返回的对象进行分解使用问题：reactive对象取出的所有属性值都是非响应式的为了方便访问，我们把reactive写的state展开，但是定时器里面不动了，数据不是响应式了 setup(){ const state=r

前端面试套餐css常见动画有哪些？实现方式？js:bind,call,apply区别？如何实现一个bind？区别手写bindVue常用的修饰符有哪些？有什么应用场景？修饰符的作用表单修饰符事件修饰符鼠标按钮修饰符键盘修饰符v-bind修饰符应用场景css常见动画有哪些？实现方式？CSS动画是层叠样式表建议的允许可扩展标记语言(XML)元素使用CSS的动画的模块css实现动画的方式，有如下三种transition渐变动画property：填写需要变化的css属性duration：完成过渡效果需

Vue3学习笔记Vue2和Vue3生命周期的区别自定义hook函数获取鼠标位置封装axios的hook如果我们要加一个监听呢？Vue2和Vue3生命周期的区别两变：最直观的是两个名称的改变Vue2Vue3beforeDestorybeforeUnmountDestoryedunmounted两删：created和beforeCreate被删掉了，因为有setup了加一个on：其他的都是加上了一个on，比如mounted---> onMounted，当然

Vue3学习笔记计算属性与监视computed函数watch函数watchEffect函数完整代码计算属性与监视computed函数- 如果传入一个回调，表示是get const fullName1= computed(()=>{ return user.firstName+'_'+user.lastName })- 如果要有get和set，那需要传入一个对象 const fullName2= computed({ get(){

Vue3学习笔记写在前面创建的两种方法写在前面准备开始系统地学习Vue3了，我觉得vue3+ts+vite会是一个不错的技术栈选择。今天草草看了以下vue3，比如数组深度监听，setup的写法，都是不错的改进。今天先带来一点vue3的创建和vite-app的使用创建的两种方法使用vue-cli创建# 安装或者升级npm install -g @vue/cli# 保证vue cli版本再4.5.0以上vue --version# 创建项目vue create my-project

v-model的实现写在前面自己的理解代码示例：father.vuechild.vue写在前面认识流于表面，也就无法体会真正的意义了！今天我们就一起来研究一下v-model！v-model的双向绑定到底是如何实现的呢？如果我们要写自己的小组件，是会用到知识！自己的理解简单来说就是父子组件的互相通信1.要实现父组件向子组件通信，可以在子组件添加一个props属性，父组件通过v-on动态传值给子组件就可以了！2.要实现子组件向父组件通信，稍微复杂一点1.子组件通过@input="$emit

父子组件间的三种通信方式通过props实现通信props静态传递father_props.vuechild_props.vueprops动态传递father_props.vuechild_props.vue 子组件不变通过$ref实现通信father_ref.vuechild_ref.vueprops和$ref的对比$emit实现通信father_emit.vuechild_emit.vue总而言之，说一下三种方法通过props实现通信子组件的props选项能够接收来自父组件的数据。props是单项绑定

Webpack-Vue问题来由代码移植报错问题来由滋了一个天气预报的demo来着，不过大家知道，天气预报就一个界面，直接用script引入vue然后开发就好了，axios也可以script引入。所以就完成啦。然后为了熟悉一下vue的初始化这些，就做了一下把这个转到webpack上，这样可以打包，这个过程自然又可以学到一些新的知识。比如跨域script引入的axios，我们可以使用jsonp来跨域(针对https)但是在webpack中就没法使用这个了，如何配置axios跨域会在研究之后和大家分享！

在vue中使用stylus文件遇到的坑！网上的解答，我不行...解决办法先在package.json文件配置(手动添加依赖)然后卸载之前的版本重新安装使用`npm install`重新建立依赖网上的解答，我不行…npm install stylus stylus-loader --save-dev这个别人都可以，我不行，用了之后会报错，出来一大串，比较戳眼睛的就是peer webpack@"^5.0.0" from stylus-loader@6.1.0但凡出现这种的就是版本不合适解决办法先

今天来学习一下vuex前言什么是vuex？使用前奏五大核心概念一个store例子StateGetterMutationsMutations的提交方式Action一个例子action的提交方式组合actionModules模块的局部状态一个vuex的应用实例前言为什么会出现vuex？1.如何让多个vue组件共享状态？2.vue组件间如何通讯？通常，在项目不是很复杂的时候，我们会利用全局事件总线解决，但是随着复杂度的提升，这些代码将变得难以维护。因此，我们需要一种更加好用的解决方案，于是，vuex

Vue中无法使用less写在前面解决方案写在前面磨刀不误砍柴工，准备在Vue中使用一下less，啥也没写，<style lang="less" scoped></style>这样就报错了，less不能用呗玛德。。。搞了一下午原来是less-loader的版本太高了解决方案1.卸载原来的lessnpm uninstall less-loader2.下载合适版本的less-loadernpm install less-loader@5.0.0 -D如果严格控

用户列表的搭建如何创建并引入一个新组件解决用户列表小问题如何使用elements如何创建并引入一个新组件1.创建一个vue文件2.在index.js中配置路由，有需要可以重定向，配置子路由等3.在App.vue中添加路由占位符4.如果有子路由，则需要在该路由中继续添加路由占位符解决用户列表小问题1.session记录下链接的激活状态2.用activePath记录下激活路径保存在session中3.在create生命周期中用activepath获取session中的activePath

Home主页的搭建配置新路由地址的vue文件并在router/index.js添加路由配置关联vue和路由登录功能的补充路由导航守卫控制访问权限退出登录的实现原理将完成登录的总代码提交到码云仓库主页布局大概布局Header部分布局左侧菜单布局通过接口获取菜单数据添加token定义一个生命周期函数左侧菜单UI绘制 v-for左侧菜单美化格式美化紧接着上次的开发[Vue项目实战]登录功能实现this.$router.push('/home') //跳转路由，进入下一个页面我们跳转了路由配置新路由地址

登录功能实现登录概述登录业务流程登录业务的相关技术点登录---token原理分析登录功能实现登录页面的布局登录概述登录业务流程1.在登录页面输入用户名和密码2.调用后台接口进行验证3.通过验证之后，根据后台得响应状态跳转到项目主页登录业务的相关技术点http是无状态的通过cookie在客户端记录状态通过session在服务器端记录状态通过token方式维持状态登录—token原理分析1.登录页面输入用户名和密码进行登录2.服务器验证通过之后生成该用户的token并返回3

Module not found:Error:Can`t resolve 'less-loader'在vue里面使用less的时候报错但是上面的方法还是报错成功的方法！在vue里面使用less的时候报错解决办法：npm install --save-dev less-loader less但是上面的方法还是报错原因是版本太高了，不太适合npm run serve成功的方法！指定一个较低的办法npm install less-loader@5.0.0 -D直接就解决报错了！...

电商系统项目概述电商项目基本业务概述电商后台管理系统的功能电商后台管理系统的开发模式(前后端分离)电商后台管理系统的技术选型1.前端项目技术栈2.后端技术栈前端项目初始化1 2 3通过`vue ui` 来初始化项目4.配置element-UI组件库5.配置axios库依赖6.初始化git远程仓库生成公钥获取密钥添加公钥终端输入7.将本地项目托管到Github或码云中1.在项目目录下打开git提交到本地仓库2.设置提交代码时得用户信息上传到远程仓库后台环境安装配置项目概述电商项目基本业务概述根据不同的应

vue ui情况如图安装最新的脚手架重新运行vue -h发现ui成功进入ui界面情况如图我们用vue -h命令查看，发现没有ui选项安装最新的脚手架cnpm i -g @vue/cli重新运行vue -h发现ui成功进入ui界面

网络应用axios 网络请求库实例axios+vue天知道案例回车查询Vue结合网络数据开发应用axios 网络请求库<script src="https://unpkg.com/axios/dist/axios.min.js"></script>axios.get(地址).then(function(response){},function(err){})axios.post(地址,{key:value,key2:value2}).then(function(respon

本地应用v-text 设置标签的文本值v-html 设置标签的innerHTMLv-on基础 为元素绑定事件计数器小结v-show 根据表达式的真假，切换元素的显示和隐藏v-if 根据表达式的真假，切换元素的显示和隐藏(操纵dom元素)v-bind 设置元素的属性(比如：src，title，class)图片切换v-for 根据数据生成列表结构v-on补充：传递自定义参数，事件修饰符v-model 获取和设置表单元素的值(双向数据绑定)记事本案例新增删除v-text 设置标签的文本值1.v-text指令

VsCode快速生成vue组件模板安装Vetur插件找到vue.json文件复制下面代码贴进vue.json文件中使用快捷键vue创建模板安装Vetur插件找到vue.json文件点击用户片段后，会出现下面的对话框，输入vue.json就可以找到vue.json了！复制下面代码贴进vue.json文件中{ "Print to console": { "prefix": "vue", "body": [ "<!-- $1

初始化Vue项目我们首先需要有vue脚手架1.新建项目2.等待初始化完成，输入指定运行3.打开running的网页我们首先需要有vue脚手架npm install -g vue-cli 全局安装vue-cli包如何将全局包地址从C盘转到其他盘请看这篇文章==>Node.js的安装与配置1.新建项目vue init webpack projectNameprojectName换为你想要的名字。这里我建立的项目名为 test然后一直回车即可2.等待初始化完成，输入指定运行cd

第一个Vue程序什么是Vue框架？Vue的优缺点？我的第一个Vue程序加入Vue框架代码代码解释el挂载点Vue实例的作用范围是什么呢？是否可以使用其他的选择器？是否可以设置其他的dom元素呢？data:数据对象什么是Vue框架？为了实现前后端分离的开发理念，开发前端 SPA（single page web application） 项目，实现数据绑定，路由配置，项目编译打包等一系列工作的技术框架。Vue的优缺点？其实Vue.js不是一个框架，因为它只聚焦视图层，是一个构建数据驱动的Web界面的库