本文是在官方文档的基础上,更加细致的说明,代码更多更全。简单来说,更适合新手阅读 ①简单来说: 就是几个组件放在一个挂载点下,然后根据父组件的某个变量来决定显示哪个,或者都不显示。 ②动态切换: 在挂载点使用component标签,然后使用v-bind:is=”组件名”,会自动去找匹配的组件名,如果没有,则不显示;改变挂载的组件,只需要修改is指令的值即可。
能够向组件添加动态类名是非常强大的功能。它使我们可以更轻松地编写自定义主题,根据组件的状态添加类,还可以编写依赖于样式的组件的不同变体。添加动态类名与在组件中添加 prop :class="classname"一样简单。无论classname的计算结果是什么,都将是添加到组件中的类名。当然,对于Vue中的动态类,我们可以做的还有很多。在本文中,我们将讨论很多内容:在 Vue 中使用静态和动态类如何
动态创建组件依靠  Vue.extend案例分析 用户通过点击新增按钮,新加下一个页签,要实现这个需求只能通过动态的创建组件,然后添加到页面中,下面来实现这个需求(页签内容部分就不做了,重点放在动态创建页签按钮)案例实现<div id="app" class="app"> <div class="title">XXX页面</div>
技术栈:Django vue Element webpack axios Qs介绍:利用django + vue 实现了 前后端分离 目前只实现了登录功能 后期项目将继续更新实现步骤:1创建Django项目django-admin startproject pc_admin2创建一个App作为项目的后台python manage.py startapp backend3使用vue-cli 创
VUE中CSS样式穿透1. 问题由来在做两款H5的APP项目,前期采用微信官方推荐的weui组件库。后来因呈现的效果不理想,组件不丰富,最终项目完成后全部升级采用了有赞开发的vant组件库。同时将webpack顺利从3升级到4(项目结构 webpack+vue+vuex+vue-router+vant+less)。相信好多做TOB的开发朋友都会选择顺手组件库。组件库内置了很多样式,方便了我们开发者
转载 2024-04-28 10:38:40
70阅读
在.env.development 添加全局拦截字符VUE_APP_BASE_API = ‘/api’vue.config.js添路径重写,/api/cust
原创 2023-06-05 11:11:17
394阅读
vant+vue(自定义单选、复选按钮图标以及扩大单选按钮范围)主要记录vant和vue使用过程中遇见的问题以及解决方案 文章目录vant+vue(自定义单选、复选按钮图标以及扩大单选按钮范围)前言一、单选按钮图标自定义?二、第一步1.html部分2.data引入自定义图标3.扩大单选按钮可点击范围总结 前言有些时候我们想自己定义单选按钮图标,以及扩大单选按钮的范围,例如在制作九宫格的时候,那么下
目录登录逻辑邮箱登录配置登录逻辑用户注册功能注册页面效果激活邮件代码配置程序预览源码 登录逻辑elment脚手架本身已经实现了登录逻辑,但是结合项目本身还需要进行改造,因为腾讯云开发不支持直连数据库去校验用户名和密码,它提供了匿名登录、邮箱登录、公众号登录等几种方式,因为我们现在没有公众号匿名登录又不符合管理后台的要求,所以选型了邮箱登录邮箱登录配置登录云开发后台,开通邮箱登录 开启之后需要配置
转载 2024-10-19 22:07:46
61阅读
【代码背景】 查询指标展示不同的表格,这些表的表头样式类似但是又不完全相同,怎么做呢?        到目前为止所有基于Element UI的表格样式都是直接在页面写死的,像官方这样:<el-table :data="tableData" style="width: 100%"> <el-table-column prop
转载 2024-03-25 07:20:33
725阅读
在我的项目中遇到了两种动态增加表单项的场景,一种是对Form的添加,另外一种是对Table的添加。当初实现这两种时还有一点喜悦,现在回过头来看,发现这两种实际就是一种,以后就可以根据个人喜好选择了。动态增加Form表单这里因为要添加的表单项存在着父子关系,要添加的子代很多,而父代属性又一致,用这种方式可以减少重复操作。表单样式就不再赘述了,具体看图image.png点击添加要素按钮,就可以添加一个
转载 2024-05-22 12:00:24
1559阅读
在某些情况,需要添加的路由不确定,需要从后端获取数据,并且后端更新相关的路由时,页面也能够立即渲染出来,这时候就需要使用动态路由。 例如商城后台项目,菜单中的很多路由都是不确定的,即使你写了10个路由,但是后端那边新增了10个路由,那么这时候设置动态添加路由后,就可以自动在第一时间创建出所有的路由,而不需要你手动的写了。1、设置默认路由以及动态路由 ① 这里需要注意动态路由和默认路由都需要加上na
转载 2024-03-26 12:27:13
104阅读
之前写了一个简单的vue日历控件:具体用法:(基本用法请参考:)   <zm-datepicker type="week" v-model="option.sDate" @select-time="selectSDate" placeholder="开始日期"></zm-datepicker>   然后简单的日历控件并不能很好的满足我现有的工作,故封装了一个稍微复杂点
转载 2024-07-25 09:52:46
829阅读
一、修改ElementUI 样式的几种方式1.新建全局样式表新建 global.css 文件,并在 main.js 中引入。 global.css 文件一般都放在 src->assets 静态资源文件夹下的 style 文件夹下,在 main.js 的引用写法如下:import "./assets/style/global.css"在 global.css 文件中写的样式,无论在哪一个 vu
转载 2024-03-26 21:20:15
484阅读
Vue2.x+ElementUI搭建项目第一步:创建Vue项目并启动1 通过脚手架命令,创建项目:2 使用npm安装Vue脚手架:3 创建新页面,并配置路由,浏览器访问新页面第二步:安装Axios用于请求API第三步:项目引入ElementUI(桌面端)组件第四步:总结 第一步:创建Vue项目并启动1 通过脚手架命令,创建项目:vue create 项目名 ;2 使用npm安装Vue脚手架:np
使用的话1.npm install vue-happy-scroll --save-dev;2.注册2.1全局注册<template> <happy-scroll> <!-- 你的内容 --> </happy-scroll> </template> <script> import Vue from 'vue
一.安装Vue1.第一步:去网上搜https://cdn.jsdelivr.net/npm/vue/dist/vue.js这个网页2.保存到电脑上 3在D盘新建一个文件夹   在Visual Studio Code里打开,新建一个目录,把Vue放在里面     二.使用Vue的具体步骤使用vue获取div中的内容,以及
 一.Vue渐进式 JavaScript 框架二.Vue安装1.安装node.js node.js中文网下载网址http://nodejs.cn/download/ 下载安装后,打开命令行(win+r 输入cmd)输入node -v 查看node的版本号,若显示如图则安装成功。安装完node.js也就有了npm管理器,它是集成在node中的,输入 npm -v 命令,显示npm的版本信息
转载 2024-02-26 11:03:29
149阅读
1.方法一const service = axios.create({   baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url   // withCredentials: true, // send cookies when cross-domain requests   headers: {     ak:
转载 2021-05-18 09:52:41
1983阅读
2评论
最近在逛各大网站,论坛,SegmentFault等编程问答社区,发现Vue.js异常火爆,重复性的提问和内容也很多,小编自己也趁着这个大前端的热潮,着手学习了一段时间的Vue.js,目前用它正在做自己的公司项目。学习的过程之中发现继最热的 React 组件库和 Angular 组件库之后,这里有很多个流行和实用的 Vue.js 组件库完善你的下一个用 Vue.JS 编写 UI 界面的应用程序。Vu
最近刚做完建站工具,准备总结里面使用到的一些技巧,同时会做一版简化的放在 github上。先来一篇翻译的文章,和我在项目中使用的动态组件思路一样,不过缺少了演化的过程,直接给出了最终的解决方案。这篇文章给的场景也很简单,但要了解这种思想是足够的。之后再详细的总结我遇到的问题和解决方案,放在更复杂的场景中。以下是翻译正文:组件并不总是具有相同的结构。有时需要管理许多不同的状态(注:指的是根据不同状态
  • 1
  • 2
  • 3
  • 4
  • 5