vue – 蓝洛水深-奇异果体育

网站

前言项目中遇到一个将表格数据输出为excel文件的需求，本需求只是简单地将简单表格的数据输出到excel，并没有涉及表格样式的复杂处理。 1、安装依赖环境

npm install file-saver --save
npm install @types/file-saver --save-dev
npm install xlsx --save

1

2

3

npm install file-saver--save

npm install@types/file-saver--save-dev

npm install xlsx--save

2、html 导出按钮

<button type="button" class="btn btn-sm btn-success" (click)="exporttable()">导出</button>

1	<button type="button"class="btn btn-sm btn-success"(click)="exporttable()">导出</button>

3、ts 文件 [crayon-673fec1…

蓝洛水深

2024年2月21日

0035

网站

因近期来发需要，需要使用到浏览器通知，故而了解和整理了一下浏览器通知的几种形式，在这里做个简单的分享。 web api notification 此特性在 web worker 中可用。参考实例：https://developer.mozilla.org/zh-cn/docs/web/api/notification#示例假定有如下 html：[cray…

蓝洛水深

2023年5月25日

00413

网站

vue中路由router传参有三种方式，分别是： params传参路由属性配置传参 query传参其中，1和2是需要有对应的接收，否则会发现虽然传了，但是没办法接收。比如

{
      path: 'edit/:id',
      name: 'schoolstudentsedit',
      component: () => import('@/views/school/students/detail.vue'),
      meta: {
        title: '编辑',
        sidebar: false,
        activemenu: '/school/students',
      },
    }

1

2

3

4

5

6

7

8

9

10

{

path:'edit/:id',

name:'schoolstudentsedit',

component:()=>import('@/views/school/students/detail.vue'),

meta:{

title:'编辑',

sidebar:false,

activemenu:'/school/students',

},

}

必须要接收id才行。以下是详解这三种方式的区别。一、params传参 [crayon-673fec1a0a59e445…

蓝洛水深

2023年5月21日

00101

网站

在初始的tinymce-vue中，图片是通过转换为base64的方式进行呈现，但是这种方式在写入数据库的时候，非常不友好，把图片放数据库，下一步就是把视频和压缩包放进去了。

images_upload_handler: blobinfo => new promise(resolve => {
    const img = `data:image/jpeg;base64,${blobinfo.base64()}`
    resolve(img)
})

1

2

3

4

images_upload_handler:blobinfo=>newpromise(resolve=>{

constimg=`data:image/jpeg;base64,${blobinfo.base64()}`

resolve(img)

})

所以，我们需要修改成以url的形式上传到后端，代码非常简洁，可以参考。[crayon-673fec1a0a7c5695463…

蓝洛水深

2023年3月14日

001.1k

网站

在处理这个问题的时候，我一度开始怀疑是不是自己一直以来的赋值方法错了，为什么安卓和pc都能正常显示表单数据，而ios则不行。如下图所示，ios端表单中的所有字段都是空的，没有内容。而安卓端和电脑端，则正常。处理过程一、是否真的有值首先想到的是，ios是否因为某种原因，没有获取到值，在数据接口处打印获取的数据：[crayon-673fec1a0a9c…

蓝洛水深

2023年1月13日

002.3k

软件

如下图所示，导出时，本来日期处只显示年月，导出后被补全到时分秒。而身份证号码则也如上图所示，变成了科学计数。尝试增加样式网上很多朋友提供了这个方法，即在身份证所在单元格设置格式。

<td style="mso-number-format:'\@';">100821199909091234</td>
增加了  style="mso-number-format:'\@';"  样式后 可以解决 ，

1

2

3

增加了 style="mso-number-format:'\@';" 样式后可以解决，

但是我这里没办法在el-table-column中新增这个样式，故而没办法实现。给xlsx插件传入参数 [cr…

蓝洛水深

2022年12月28日

011.1k

杂谈

第一是为了练手，代码不写看万行不如写一行；第二是自己也需要用到；电脑端手机端访问地址 https://tool.lanluo.cn/#/video/start 后续将陆续添加各种工具，同时也尽量做好解析接口的维护。

蓝洛水深

2022年12月12日

00164

网站

此前已经讲过两次关于跨域的问题。 vue前后端分离时，本地小皮面板400等错误解决 vue和thinkphp6做前后端分离时，跨域请求怎么设置？access-control-allow-origin设置教程但是近期进行复核是发现，如果每次请求都要进行跨域预请求的话，可能最终还是会导致无法请求到资源。以thinkphp6为例，在开启路由中间件的前提下，需要…

蓝洛水深

2022年12月11日

00942

网站

很简单，直接写就行了，在rules中参照如下写法进行：

rules: {
        name: [
            { required: true, message: '必填项', trigger: 'blur' }
        ],
        phone: [
            { required: true, message: '必填项', trigger: 'blur' },
            { pattern: /^(?:(?:\ |00)86)?1[3-9]\d{9}$/, message: '请输入合法手机号/电话号', trigger: 'blur' }
        ]
    },

1

2

3

4

5

6

7

8

9

rules:{

name:[

{required:true,message:'必填项',trigger:'blur'}

],

phone:[

{required:true,message:'必填项',trigger:'blur'},

{pattern:/^(?:(?:\|00)86)?1[3-9]\d{9}$/,message:'请输入合法手机号/电话号',trigger:'blur'}

]

},

pattern: /^(?:(?:\ |00)86)?1[3-9]\d{9}$/就正则表达，可以根据实际情况调整。常用正则分享火车车次

/^[gcdztspkxly1-9]\d{1,4}$/

1	/^[gcdztspkxly1-9]\d{1,4}$/

手机机身码(imei) [crayo…

蓝洛水深

2022年10月10日

031.7k

做系统开发过程中，难免要自己产生一些富文本内容，重复造轮子不是一个很好的选择，所以找一款合适的开源，是一个很好的解决途径。本文收集整理了六款开源富文本编辑器，希望能抛砖引玉，有所启发。一、quill 奇异果体育官网地址（演示地址）： https://quilljs.com/ 项目地址： https://github.com/quilljs/quill/ start…

蓝洛水深

2022年8月10日 • 软件

037.0k