vue
关注
分享
扫一扫
兮木兮木
此人不懒,也什么都没有写。
展开
-
vue3路由动画效果的一些问题
应用于整个离开动画阶段。在离开过渡效果被触发时立即添加，在过渡或动画完成之后移除。在元素被插入之前添加，在过渡或动画完成之后移除。在一个离开动画被触发后的下一帧被添加 (也就是 v-leave-from 被移除的同时)，在过渡或动画完成之后移除。在元素插入完成后的下一帧被添加 (也就是 v-enter-from 被移除的同时)，在过渡或动画完成之后移除。in-out: 先执行进入动画，然后在其完成之后再执行元素的离开动画（不常用）out-in: 先执行离开动画，然后在其完成之后再执行元素的进入动画。原创 2023-02-09 09:54:34 · 820 阅读 · 1 评论 -
vue-router 利用 $route 的 matched 属性实现面包屑效果
我们以一个固定的路由表来说明let routes = [ { path: '/', component: () => import('../pages/layout/Layout.vue'), children: [ { name: 'pageA', path: 'a', component: PageA, children: [ { name: '..原创 2020-11-20 17:25:09 · 19860 阅读 · 11 评论 -
vue 实现动态表单动态渲染组件的方式（二）
思路先把所有可能出现的表单/组件写在主页面每个表单/组件的slot 属性值要与后端返回的表单/组件类型匹配根据后端返回的数据，动态生成一个slot列表，slot的name属性要与数据的类型匹配，此列表放入一个子组件在主页面引入子组件，把之前主页面写好的各个表单/组件放入子组件标签中，通过匹配slot插槽去渲染组件，没有匹配到插槽的则不会渲染案例//主页面<templ...原创 2020-04-24 03:15:23 · 1130 阅读 · 1 评论 -
vue 实现动态表单动态渲染组件的方式（一）
vue 实现动态表单/动态渲染组件的方式（一）思路先写好各个可能会出现的表单或者自定义的组件，引入。此时后端可能会给到一个对象型数组，每个对象有要渲染组件的一个类型标识利用component is 动态组件，根据不同的组件类型标识，渲染展示不同的组件在利用组件的数据通信去收集各个子组件的数据实现demo三个表单组件，用了element-ui，此...原创 2020-04-24 02:46:42 · 4139 阅读 · 0 评论 -
vue [自定义组件的 v-model]
vue [自定义组件的 v-model]vue官网描述一个组件上的 v-model 默认会利用名为 value 的 prop 和名为 input 的事件，但是像单选框、复选框等类型的输入控件可能会将 value attribute 用于不同的目的。model 选项可以用来避免这样的冲突：Vue.component('base-checkbox', { model: { pro...原创 2020-04-24 02:12:45 · 219 阅读 · 0 评论 -
vue 中使用/deep/深度选择器，谷歌浏览器报出警告
vue开发中控制台警告： **/deep/ combinator is no longer supported in CSS dynamic profile.**应该是/deep/ 在将来会被移除vue-loader官方文档中对于深度选择器的描述深度作用选择器如果你希望 scoped 样式中的一个选择器能够作用得“更深”，例如影响子组件，你可以使用 >>> 操作符：...原创 2020-04-17 01:13:31 · 8216 阅读 · 1 评论 -
vue中 style 中scoped的说明
通俗来讲，在vue文件的style中加上scope关键字，可以保障此文件中的css样式只在此文件内生效，即便是class类名相同。就是不会作用于子组件中与父组件相同类名元素。还有一种例外的情况，就是即使加上了scoped，子组件的根元素样式，会受父组件与子组件共同影响，比如，我在父组件设置.content {color: red},如果子组件的根元素也是class='content'，那...原创 2020-04-12 00:50:57 · 332 阅读 · 0 评论 -
关于element-ui 的upload组件 在vue中应用的几点说明（主要说http-request自定义上传过程的参数的使用）
因为upload组件默认用的http的请求，现在需要用websocket去做上传，经过查看element-ui的文档没找到方便的方法，故使用了http-request自定义上传的方式来上传文件几个配置参数的说明action ：上传的url地址，必填项，如果用自定义上传可以随便填个字符串http-request ： 覆盖默认的上传行为，可以自定义上传的实现 ，传入一个函数，函数的参...原创 2020-04-05 02:16:21 · 3542 阅读 · 0 评论 -
transition 动画与 display: none 冲突的问题
几种元素消失的属性display: none; 元素消失，不占位。visibility: hidden; 元素消失， 占位。opacity: 0;透明度设为0， 元素看不见，占位。width: 0;宽度设为0 ， 元素看不见，不占位。问题transition与display搭配使用时，会导致过渡消失，直接呈现或者消失元素，可能是transition过渡不支持display的...原创 2020-02-24 20:38:16 · 7621 阅读 · 0 评论 -
vue拖拽组件vuedraggable的使用说明
需了解H5的draggable属性，通过下面的代码注释，可了解<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale...原创 2020-01-11 15:30:02 · 5640 阅读 · 3 评论 -
vue 组件传值之 $attrs、$listeners
vue 组件传值之 attrs、attrs、attrs、listenersvue的通信方法常用的有，父传子 props， 子传父 通过绑定@事件，子组件$emit 传值，也可以父组件给子组件props传递一个函数，子组件调用函数，利用参数传值。其他的还有vuex集中状态管理，eventBus也就是事件的全局$emit, $on 来抛发事件传值以及接下来的attrs、attrs、attrs、...原创 2020-01-04 16:49:35 · 1496 阅读 · 1 评论