VUE
等樱花的龙猫
每天写不同的bug
展开
-
如何搭建一个vue项目(完整步骤)
转载如何搭建一个vue项目(完整步骤)转载 2021-01-19 09:20:38 · 156 阅读 · 0 评论 -
vue监听div大小改变多个echart大小
vue监听div大小改变多个echart大小,使echart自适应div的大小且不冲突我们在写echart图表时会遇到其不会根据窗口大小的变更而自适应界面的问题第一种问题:单个echart,不会根据窗口大小的变更而变更第二种问题:多个echart,不会根据窗口大小的变更而变更第三种问题:多个echart,不会根据父组件的div大小的变更而变更以下给出解决方案,三种都能解决掉,如果有优化余地请留言提醒一下我们先通过下载element-resize-detector用来监听dom元素(如div)在原创 2021-01-25 15:44:20 · 1398 阅读 · 0 评论 -
Vuex的运用
Vuex在element-ui中的运用简单实现效果如下勾选的是已完成的数据,去掉勾选则放到未完成处,展示个动态总数代码如下:以下为index.js中的代码import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)export default new Vuex.Store({ state: { //原始数据list,也可以在mutations中获取获取后端数据 list: [{ id: '0',原创 2021-04-14 08:26:24 · 93 阅读 · 0 评论 -
具名slot插槽使用
具名slot插槽使用首先搞个页面放插槽用<template> <div> <div> <h2>这是上部</h2> //放两个插槽,名字分别为a1跟a2 <slot name="a1"></slot> <slot name="a2"></slot> <h2>这是下部</h2> </div&g原创 2021-04-14 14:17:17 · 162 阅读 · 1 评论 -
vue框架如何将侧边栏完全隐藏
vue框架如何将侧边栏完全隐藏如何将vue的左侧边栏在缩进的时候完全隐藏呢,效果图如下找到目录src/style/sidebar.scss 然后搜索.hideSidebar可以搜出两个,不要慌,下面的时手机端的,我们拉到上面的.hideSidebar找到.hideSidebar { .sidebar-container { width: 54px !important; } .main-container { margin-left: 54px;原创 2021-02-24 13:23:55 · 3138 阅读 · 2 评论 -
vue全屏时隐藏顶部栏
vue全屏时隐藏顶部栏vue可以点击按钮进行全屏显示,如果想在全屏时看到更多,隐藏掉顶部栏,我们可以这样编写代码,按钮图如下设置完后效果图如下,这是整个电脑窗口的样子首先我们找到这个按钮的代码screenfull的index.vue路径在src/components/Screeful/index.vue,找不到就全局搜索下进入里面我们可以看到如下代码<template> <div> //isFullscreen表示全屏与不全屏 <svg-ico原创 2021-02-24 15:49:08 · 2391 阅读 · 0 评论 -
vue项目中加入富文本编辑器
vue项目中加入富文本编辑器如何在vue项目中加入富文本编辑器呢,我们首先先下载npm install vue-quill-editor下载完后,在vue页面中引入组件import { quillEditor } from 'vue-quill-editor'import 'quill/dist/quill.core.css'import 'quill/dist/quill.snow.css'import 'quill/dist/quill.bubble.css'并记得注册组件comp原创 2021-02-23 08:54:53 · 1189 阅读 · 0 评论