属性绑定获取自定义属性值   v-bind如果想要操纵被挂载标签的属性,则使用v-bind进行属性绑定,当然也可以进行简写,简写形式为:。需要注意的有以下两点:如果包裹属性的是双引号,它将访问Vue实例尝试获取该属性如果包裹属性的是单引号外层再包裹上双引号,则代表这就是一个普通的字符串单纯双引号,将会访问Vue实例尝试获取该变量:<!-- 结果:<p s1
转载 2024-09-26 22:14:42
153阅读
方法1:var testDate = new Date(); // toString() 把 Date 对象转换为字符串。 var dateobj_toString = testDate.toString(); // toTimeString() 把 Date 对象的时间部分转换为字符串。 var dataobj_toTimeString = testDate.toTimeS
    最近为移动端使用rem雪碧图小图标自适应困扰,想了半天终于找到解决方案!难点在于雪碧图要跟随屏幕缩小,下面我们进入正题!    大家先要明白rem是什么,我给大家个新的理解,rem的本质就是百分比转换,不明白的童鞋可以具体去恶补下rem相关知识!既然rem的本质是百分比转换,那么我们也可以通过同样的方法转换雪碧图,下面上案例!  &nbsp
转载 10月前
72阅读
新建项目12345678# 安装 npm install -g @vue/cli # 新建项目 vue create my-project # 项目启动 npm run serve # 打包 npm run build打包后的文件,对引用资源注入了预加载(preload/prefetch),启用 PWA 插件时注入 manifest/icon 链接,并且引入(inlines) webpack ru
目录1. 安装下载nuxtjs2. 配置路由3. 配置路由重定向4. 配置一些全局的css5. 使用sass6. 编写公共头部布局模板7. 改写组件8. 改写请求接口9. 改写vuex10. 引入第三方插件11. 配置meta12. 开启gzip、brotli压缩13. 部署 这个项目之前也是想用nuxt做的,但是当时还不会,就用了预渲染,最近刚学了nuxt,顺便练习一下 原项目是基于 vu
转载 2024-10-21 09:32:42
54阅读
【需求】实现三个(数字+文字)的页面效果【场景】后端提供的数据格式为对象,其中有三个键名对应着所需数字,文字则不提供(需前端自行匹配)【思路】1. 最开始的做法是单独写出来<div class="test"> <div> <p class="figure">{{ obj.numA }}</p> <p&gt
1.安装插件postcss-plugin-px2rem;npm i postcss-plugin-px2rem --save -dev2.在vue.config.js中配置 。这里需要说明一点,网上搜的一堆教程都强调应该增加remUnit来设置rem的计算标准。但是其实在新版后,这个值换成了rootValue这个。例如你设计稿为750的宽度标准,那么这里的值设置为75则可。module
Wepy项目转移到uniapp项目 (经过上网百度以及官网的学习、大概解决了、还有一些和服务端连接的问题没处理好) 一、 (vscode条件下实现的在hbuilderX也可以正常运行) 1.1 全局安装:npm install -g @vue/cli 1.2 通过cl创建uni-app项目:vue create -p dcloudio/uni-preset-vue my-project 后面可以选
 (注:本文适用于有一定Vue基础或开发经验的读者,文章就知识点的讲解不一定全面,但却是开发过程中很实用的) 首先介绍一下混入mixin的概念:官方文档:混入提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。个人理解:混入就是用来对vue组件中的公共部分,包括
转载 20天前
341阅读
Situation需求 项目中的一种题目 计算题需要配置特定运行指令,计算题的编辑和新增是同一个页面 基本信息提交、配置指令提交和配置文件上传各是一个接口,一共涉及3个接口 指令提交和文件上传均需要questionId,因此我们设计 第一页进行题目基本信息提交,请求成功后后端返回questionId,我们拿到questionId后 下一步 跳转至 第二页,进行指令的配置 问题 编辑计算题时,第一页
转载 2024-05-17 17:50:20
77阅读
transition过渡属性属性描述值举例transition简写,包含4个过度属性transition:width  1s  linear  1s;transition-propertycss属性的名称all:所有属性都将获得过渡效果。transition-property:height;transition-duration过渡效果花费的时间,默认0transit
vue-cli3.0实现移动端自适应,亲测有效项目使用vue3.0编写代码,说要打包成apk文件,在安卓上看,现在需要适配移动端的样式,记录一下,亲测有效。安装插件vue脚手架略过lib-flexible : 会自动在html的head中添加一个<meta name="viewport">的标签,同时会自动设置html的font-size为屏幕宽度除以10,也就是1rem等于html根
文章目录先用官方的命令,新建一个nuxt项目改造目录在根目录新建src文件夹,将文件夹都剪切到src中,配置nuxt.config.js配置router.js配置eslint项目迁移安装插件配置别名文件迁移配置插件(我们自己封装的install插件)配置环境,以及不同的环境下打包到不同的目录修改package.josn里面的命令修改nuxt.config.jsnuxtjs中使用高德地图nuxt.
转载 2024-10-11 14:08:16
247阅读
文章目录Vue项目打包成exe可执行文件需要工具执行步骤跨域失效解决方案 Vue项目打包成exe可执行文件一篇好文章 如何用electron技术将Vue项目打包成exe可执行文件需要工具1. node版本>12 2. vue版本>2.x 3. 魔法上网工具不满足条件的先去升一下,再继续下边的操作执行步骤进入Vue项目的根目录,打开命令行,注意项目所在路径不能有中文,否则会报错的哦 v
升级版本通常情况下,把版本升级到最新不仅可以提高编译速度也可以避免一些出现过的问题( 惨遭打脸选用的 Ant Design of Vue 就重大更新了一次,又重新写的 )。按需加载比如常见的 lodash 库,我们显然不需要全部都用到,所以要采用按需加载的方式来引用,对一些常见的方法进行提取统一进行处理,一般来说如果支持的话,文档都会标注,如果没有又不想要体积太大就自己写一个,这方面不在过
本篇博客是给已经有了vue、react等框架基础的同学预览的,重点讲述培养学习思维,以不一样的思维带你深入uni-app。。。ps:看文档要认真细心看完。仔细领悟。从vue到uni-app只需要这一篇文章就够了。。1.刚学习uni-app,第一步应该考虑哪些东西?了解其应用场景,整合其优势,大规模的线上案例这是必然的,具体的介绍需要大家去细细研究。我们既然已经有了前端框架的开发经验,学习一个新的线
vue项目移动端、pc端适配方案vue项目移动端、pc端适配方案lib-flexible 根据屏幕宽度,自动设置html的font-size postcss-px2rem 自动将px单位转换rem 一、安装 lib-flexible和 postcss-px2remnpm i lib-flexible -S npm i postcss-px2rem -S简要介绍这两个包的用途:lib-flexi
转载 2024-04-04 11:38:14
1547阅读
Vue读取网络路径Excel文件转换为Html预览,打印前言一、预览EXCEL文件1.获取网络路径Excel文件2.转换格式后的数据3.最终结果二、打印文件 前言我们需要对一些Excel文件进行预览,那么可以调用第三方的接口转到别的页面进行预览,可是这样比较花费时间,而且还受到网络网速的影响。因此我们可以将Exce文件转为html的table格式或者是json格式来达到我们获取信息的目的一、预览
转载 2024-04-09 13:20:41
62阅读
前言你是不是习惯了vue2的赋值即响应式?vue2还有个Vue.observable但你从没用过?结果Vue3像跳跳糖一样跳出来这么多的响应式API,你有没有懵逼的感觉?不慌,挨个学。由于官方文档写的晦涩难懂,所以我写下这篇。原创:简书microkof。首先说明,全文提到的“基本数据”是指“数据类型为基本数据类型的数据”,“原始数据”是指被转变为响应式数据之前的纯对象或基本数据。reactiveV
vue现在已经出到3.x了,但是2.x还是使用的更多,就像我现在工作中在做的项目。身为后端,有时候不得不也要会前端的知识,本篇就按顺序先从2.x开始入门吧。 一、vue.js背景先声明一下,vue.js和vue是指一个东西,vue只是vue.js的简称罢了。1.什么是vue官方的说法是:vue是一套用于构建用户界面的渐进式框架。从这里我们就可以看出vue首先不是某个类库,而是一个框架,这
  • 1
  • 2
  • 3
  • 4
  • 5