AIGC大前端小王子

在Vue应用中实现国际化（i18n），通常需要使用一些专门的库，比如vue-i18n。本文主要介绍自定义封装i18n，支持Vue、uniapp等版本。

首先创建一个用于加载SVG文件的Vue组件。将SVG文件放在项目的某个目录下，例如components/svgIcon/。创建一个函数来动态导入SVG文件，并注册到Vue组件中。在项目中通过组件标签使用SVG图标。

快速排序算法演示。

一个样式更加美观大方的HTML页面示例，其中包括了二分查找算法的演示。

前端技术原理。

本文主要介绍iframe 进行通信iframe支持自定义配置iframe链接内容以及页面关闭按钮的样式配置，适用于将网页嵌入可视化应用中进行显示。

本文主要介绍el-table点击复选框或点击数据行，当前行高亮显示。

本文主要通过scrollIntoView解决页面有非空字段为空时提交，未自动定位到非空处。方法将调用它的元素滚动到浏览器窗口的可见区域。二、CASE案例页面逻辑三、参考样式

本文主要介绍mescroll.js 在 H5端 运行的下拉刷新和上拉加载插件。支持混合APP开发等多个平台。

本文主要介绍echarts饼图各个板块之间间的空隙怎么实现关键代码"itemStyle": { "normal": { "borderWidth": 1, // 间距的宽度 "borderColor": '#fff', //背景色 }},代码层级效果图

本文主要介绍柱状图重叠，实现条纹背景图和背景色的组合图。一、关键性代码// base64位背景图 此处可以改为相对路径 var barImage = './img/chart_bg.png';// 在线上转base64位工具 https://www.sojson.com/image2base64.html var barImage = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAAH6ji2bAAAAGXRFWHRTb2.

本文主要介绍echarts在Vue中如何使用。一、安装依赖echartsnpm install echarts -S二、图表创建2.1在main.js中，引入（全局）// 引入echartsimport echarts from 'echarts'Vue.prototype.$echarts = echarts2.2在.vue任意页面，如：index.vueDOM代码&......

在柱状图上，点击某条柱形，调用相应的方法或跳转相应的界面接下来就详细介绍如何实现柱状图的点击事件一、简单的点击事件myChart.on('click', function (params) { var index = vm.index; var select = params.dataIndex; if (index !== select) { var confType; if (select === 0) { vm.focusType.

本文主要介绍Vue项目按需引入echarts图标工具，包含了echarts基础模块、折线图、柱状图、饼图、提示框、title框、图例等。一、安装echarts包npm install echarts -S二、按需引入在根目录下main.js引入// 引入 ECharts 主模块let echarts = require('echarts/lib/echarts');// 引入折...

本文主要介绍echart的使用。一、标题组件 tittletitle:{ show: true, //是否显示标题组件 text: '主标题', link: 'https://www.vitian.vip', // 超文本链接 target: 'blank', // 'self' 当前页打开 'blank' 新窗口打开 textStyle:{ //内容样式 c...

本文主要介绍css3动画实现父容器慢慢升起和缓缓落下思路：1.先把静态样式写好2.给父容器添加样式transform: translateY(100%);这样就可以被隐藏起来，如果不生效，可以再加一下display:inline-block;可视区域最好在加一个overflow:hidden;体验更加。3.通过对于的方法给父容器添加动画进入样式和动画退出样式。下方展示的是小程序的实现...

本文主要介绍对iphoneX及以上适配。提供css和js的适配方式。一、设置网页在可视窗口的布局方式<meta name="viewport" content="width=device-width, viewport-fit=cover">注：viewport-fit=cover使得页面内容完全覆盖整个窗口二、页面主体内容限定在安全区域内body { padd...

随着客户对UI什么的提升，很多不规则形状的需求就随之出现了。一、UI需求二、解决方案2.1 HTML<div class="nav_wrapper"> <div @tap="changeNav(index)" v-for="(item,index) in navList" :key="index" class="nav_item" :class="{'active':index==currentNav}"> <span v-text="item"&gt.

本文主要介绍CSS书写规范，CSS书写顺序、CSS属性、CSS命名规则等。一、CSS书写顺序1.1位置属性(定位层级布局、显隐性)position, top, right, z-index, display, float等。1.2大小(宽高、内外间距)width,height,padding,margin1.3文本样式font,line-height,letter-spacing...

本文主要介绍CSS解决连续英文字母或连续数字不能自动换行问题word-wrap:break-word;

本文主要介绍npm 安装 sassnpm install node-sass --save-dev npm install sass-loader --save-dev

本文主要介绍移动端input获取焦点时，IOS固定定位fixed失效，位置偏移。一、场景描述移动端ios下，input获取焦点时，固定定位的fixed会转化为absoult属性，滚动条滚动超过可视区域，导致位置偏移。二、解决方案2.1将fixed的定位与滚动区域分离成2个部分2.2滚动区域做absoult布局三、CSS代码.nav-wrapper{ // 顶部fixed布局...

本文主要介绍css实现文本单行和多行超出隐藏显示省略号。一、单行超出隐藏.ellipsis{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}二、多行超出隐藏.ellipsis-2 { display: -webkit-box; overflow: hidden; white-s...

本文只要介绍通过css，实现H5隐藏滚动条。在父类.class名下，也可以放在body，全局隐藏滚动条。.class{ &::-webkit-scrollbar{ background-color:transparent; }}...

本文主要介绍Vue2.0 style样式scoped使用less时样式穿透覆盖。主要实现的方法是/deep/和>>>一、使用/depp/<style scoped lang="less"> .class{ /deep/.upwarp-nodata, /deep/.upwarp-tip { .px2rem(font-size, 12......

本文主要介绍elementUI table组件获取表格当前行的索引

本文主要介绍H5页面长按复制功能实现默认情况下禁止了长按复制功能，要此功能需要增加css声明：-webkit-user-select: auto;让整个页面可以长按复制：*{-webkit-user-select: auto;}

本文主要介绍 vue v-for渲染数据出现DOMException: Failed to execute ‘removeChild’ on ‘Node’: The node to be removed is not a child of this node.处理方案data(){ // 是否操作中 使用了vue的v-for渲染数组数据,在一次改变数组的时候出现异常报错,而实际的数组是已经变化过的了,页面卡死 opting: true,},methods:{ // 切换二级菜单栏 ch.

推荐六本前端开发必看的书籍

本文主要介绍js批量操作（删除、重命名、置顶）、置顶、删除、上移、下移、重命名

本文主要介绍js跑马灯，适用于限制标题超出滚动，调整滚动时间。方法// 跑马灯titleScroll() { if (this.goodsInfo.dclGoodsCname.length>20) { let title = this.goodsInfo.dclGoodsCname console.log(this.goodsInfo.dclGoodsCname.length) let fristchar = title.charAt(0); //在从中取第一个字符；(char.

本文主要介绍js判断当前时间返回上午好、中午好、下午好等，对应的时间段名称。nowName(){ let nowName = new Date(), hour = nowName.getHours() if (hour < 6) { nowName = "凌晨好！" } else if (hour < 9) { nowName = "早上好！" } else if (hour < 12) { nowName = "上午好！" } else if (hour &l.

本文主要介绍经纬度打开腾讯、百度地图// 打开腾讯地图openLocation(){ let lat = this.enterprise_info.latitude let lon = this.enterprise_info.longitude let title = this.enterprise_info.location_name let addr = this.enterprise_info.location_address var mapUrl_tx = "http://api.

本文主要介绍文件流和base64互转

canvas实现图片压缩

本文主要两种js实现订单号的生成。一、时间戳+6位随机数的订单号function orderCode() { var orderCode=''; for (var i = 0; i < 6; i++) //6位随机数，用以加在时间戳后面。 { orderCode += Math.floor(Math.random() * 10); } orderCode ...

本文主要介绍return 、break和continue的区分一、我是谁，我能做什么1.1return大家好，我是return！我并不是专门用于跳出循环的，我的功能是结束一个方法。 一旦在循环体内执行到我，我将会结束该方法，循环自然也随之结束。与continue和break两位兄弟不同的是，我是直接结束整个方法，不管这个我处于多少层循环之内。1.2continue大家好，我是cont...

本文只要介绍JS计算附件大小，默认保留2小数。/** * 计算附件大小 * */getFileSize:function(limit){ // 传参limit为初始值 var size = ""; if( limit < 0.1 * 1024 ){ //如果小于0.1KB转化成B size = limit.toFixed(2) + "B"; ...

Node.js已经成为前端开发人员必备技能。So在学习的过程中，和大家一起分享一下经验。一、安装Node.js环境，可以官网直接下载或者指令下载 二、安装Express$npm install express -g$npm install express-generator -g三、创建express项目，初始化 3.1cmd终端打开指令，依次输入如下指令，根据自己实际需...

本文主要介绍Ajax在for循环中，请求只返回一次结果的问题解决。一、async决定了同步与异步请求1.1 Ajax默认是异步请求，会继续执行Ajax后面的脚本，直到服务器端返回数据后，触发Ajax里的success方法，这时候执行的是多个线程，其根源是async属性默认是 true。1.2 async 设置为 false，则所有的请求均为同步请求，在没有返回值之前，同步请求将锁住浏览器...