vue开发网站-使用插件element、vant 遇到的问题

1. js把两个字符串放进一个另字符串里,用逗号分隔

let string1 = "Hello";
let string2 = "World";
let result = `${string1},${string2}`;
console.log(result); // 输出: Hello,World

2.js将字符串转为数组

const str = "Hello, world!";
const arr = str.split(", "); // 使用逗号和空格作为分隔符
console.log(arr); // 输出: ["Hello", "world!"]

3.获取文件名的后缀

const fileExtension = file.name.split('.').pop();
console.log('文件后缀:', fileExtension);

4.往数组里push新的数据

出现报错:this.content.page4.push is not a function

解决方法:确认 this.content.page4 是否应该是一个数组。
如果是,确保它在被赋值之前被初始化为一个数组。
如果不是数组,需要将 page4 转换为数组

if (!Array.isArray(this.content.page4)) {this.content.page4 = [this.content.page4];
}
this.content.page4.push(newItem); // 现在应该可以正常调用了

在这里插入图片描述

5.一个固定3行的表格,循环接口返回的内容,当第一次进入 接口内容为空时,表格也为空,就会没有用户填写的入口,此时应该判断一下:默认push3条空数据

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

6.vue点击按钮调取打印

点击按钮
在这里插入图片描述

调取打印该页面在这里插入图片描述

<div  @click="clickDown()">下载</div>methods: {//下载-调取打印clickDown() {window.print()},
}<style>/* 点击打印的样式 */@media print {.clickDown {display: none;}}
</style>

7.el-radio单选回显,打印预览不显示

el-radio单选回显页面上是这样的:
在这里插入图片描述

打印预览是这样的:
在这里插入图片描述
解决方式:
不是代码的问题,打印预览时,需要在【选项】中选中【背景图形】的。
在这里插入图片描述

8.vue打印预览时,关于页眉页脚

8.1关于页面的页眉页脚,都可以在这里设置:

比较灵活一点,根据自己需求进行选择

在这里插入图片描述

8.2也可以在样式代码里单独设置:

代码设置之后,无论点不点击选项按钮,页眉页脚都会隐藏

/* 打印的样式 */@media print {/*去除页眉页脚*/@page {size: auto;margin: 10px;}html {background-color: #FFFFFF;margin: 0;}body {margin: 10px 15px;} /*去除页眉页脚*/}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/21476.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

跨越百亿营收的今世缘,全国化进程仍挑战重重?

当前&#xff0c;白酒市场正在经历一场深度调整&#xff0c;随着存量时代到来&#xff0c;白酒品牌地位的更替和竞争格局的重构已经展开。这一背景下&#xff0c;今世缘等地方性酒企也正在凭借对区域市场的深耕&#xff0c;展现出较快的成长速度&#xff0c;并希望能借此占领市…

超强算力 Orange Pi Kunpeng Pro 开发板基础测评与体验

目录 开箱体验资源简介系统启动连接网络登录系统通过桌面登录通过串口登录通过 SSH 登录配置散热风扇 算力测试MNIST示例MBNET示例 体验总结 大家好&#xff0c;我是 Hello 阿尔法&#xff0c;有幸接到 CSDN 的邀请参与 Orange Pi Kunpeng Pro 开发板的测评活动&#xff0c;本文…

【Redis】redis高阶-使用zset实现延时队列

Hi,大家好&#xff0c;我是抢老婆酸奶的小肥仔。 最近在使用redis时&#xff0c;就想能不能用其实现消息队列&#xff1f;也在网上看了下其他小伙伴写的实现&#xff0c;结合自身业务实现了如下消息队列&#xff0c;希望对大家有用。 废话不多说&#xff0c;直接开撸。 1、为…

hmcode硬件编程1

在/home/golemon/hmcode/applications/sample/wifi-iot/app内创建文件夹。 这里创建了d_6_3文件夹 . ├── BUILD.gn ├── d_6_3 │ ├── BUILD.gn │ └── lab.c ├── demolink │ ├── BUILD.gn │ └── helloworld.c ├── iothardware │ ├── B…

安装Lubuntu24.04

Lubuntu24.04安装过程与22.04、20.04等完全一致。 记录 01 02 03 04 05 09 给出提示 10 11 12 13 特点 Lubuntu 22.04的特点主要包括以下几点&#xff1a; 轻量级且高效&#xff1a;Lubuntu作为Ubuntu的一个轻量级分支&#xff0c;专注于为低端电脑、老旧电脑或需要最大限…

【Java】设计一个支持敏感数据存储和传输安全的加解密平台

一、问题解析 在一个应用系统运行过程中&#xff0c;需要记录、传输很多数据&#xff0c;这些数据有的是非常敏感的&#xff0c;比如用户姓名、手机号码、密码、甚至信用卡号等等。这些数据如果直接存储在数据库&#xff0c;记录在日志中&#xff0c;或者在公网上传输的话&…

如何在QGIS中加载MapBox图源

在设计行业中需要多风格地图的调用&#xff0c;不管是规划、建筑设计还是景观&#xff0c;分析图的工作量都大&#xff0c;有好的底图&#xff0c;会事半功倍。 针对不同项目&#xff0c;会选择不同配色的底图&#xff0c;以便让设计内容中的呈现足够清晰。 这里就来分享一个…

DP读书:《半导体物理学(第八版)》(七) 金属与半导体的接触- 10 min 速通(载流子分布)

《半导体物理学&#xff08;第八版&#xff09;》10 min 速通 金属与半导体的接触 7.1 金属与半导体的接触及其能带图7.1.1 金属和半导体的功函数7.1.2 接触电势差7.1.3 表面态对接触势垒的影响 7.2 金属半导体接触整流理论7.2.1 扩散理论7.2.2 热电子发射理论7.2.3 镜像力和隧…

深度神经网络——什么是梯度下降?

如果对神经网络的训练有所了解&#xff0c;那么很可能已经听说过“梯度下降”这一术语。梯度下降是提升神经网络性能、降低其误差率的主要技术手段。然而&#xff0c;对于机器学习新手来说&#xff0c;梯度下降的概念可能稍显晦涩。本文旨在帮助您直观理解梯度下降的工作原理。…

论文精读--Swin Transformer

想让ViT像CNN一样分成几个block&#xff0c;做层级式的特征提取&#xff0c;从而使提取出的特征有多尺度的概念 Abstract This paper presents a new vision Transformer, called Swin Transformer, that capably serves as a general-purpose backbone for computer vision. …

cesium 的初步认识

Cesium是一个基于JavaScript开发的WebGL三维地球和地图可视化库。它利用了现代Web技术&#xff0c;如HTML5、WebGL和WebAssembly&#xff0c;来提供跨平台和跨浏览器的三维地理空间数据可视化。Cesium的主要特点包括&#xff1a; 跨平台、跨浏览器&#xff1a;无需额外插件&am…

常见4种时间管理方法及实施步骤(收藏版)

有效的时间管理方法&#xff0c;不仅能够保证项目按时交付&#xff0c;还能提高开发效率&#xff0c;减少成本超支和质量风险。如果缺乏明确的时间规划&#xff0c;可能会导致任务延误&#xff1b;容易造成资源分配不当&#xff0c;导致整体效率低下和成本增加。 因此有效的时间…

docker 安装mysql,redis,rabbitmq

文章目录 docker 安装ngnix&#xff0c;mysql,redis,rabbitmq安装docker1.安装下载docker-ce源命令2.安装docker3.查看版本4.查看docker状态5.启动docker6.测试安装ngnix 安装mysql8.0.361.拉取mysql镜像2.安装mysql8 安装redis1.拉取redis7.0.11镜像2.安装redis3.进入容器内部…

独立游戏开发的 6 个步骤

&#x1f482; 个人网站:【 摸鱼游戏】【神级代码资源网站】【工具大全】&#x1f91f; 一站式轻松构建小程序、Web网站、移动应用&#xff1a;&#x1f449;注册地址&#x1f91f; 基于Web端打造的&#xff1a;&#x1f449;轻量化工具创作平台&#x1f485; 想寻找共同学习交…

高安全且适应不同业务模式的跨网文件交换系统

在当今的商业环境中&#xff0c;文件的快速和安全传输对于企业运营至关重要。特别是在金融、医疗和政府等对数据保护和合规性要求极高的领域&#xff0c;传统的文件传输方式已经显得力不从心。因此&#xff0c;跨网络文件交换系统成为了企业数据传输不可或缺的工具&#xff0c;…

文件访问被拒绝,原来可以这样处理!

在使用电脑的过程中&#xff0c;我们有时会遇到无法访问某些文件的情况&#xff0c;通常会看到“文件访问被拒绝”的错误提示。这种情况可能是由于文件权限设置问题、文件正在被其他程序使用、系统错误或者病毒感染等原因引起的。本文将介绍三种解决文件访问被拒绝问题的方法&a…

【遂愿赠书 - 1期】:安恒“网安三剑客”-大模型时代下的网络安全实战指南

文章目录 一、图书背景二、网安实战宝典2.1《内网渗透技术》2.2《渗透测试技术》2.3《Web应用安全》 三、校企合作&#xff0c;产学研结合四、大模型时代的数字安全五、 网络安全无小事 一、图书背景 大模型风潮已掀起&#xff0c;各大巨头争相入局&#xff0c;从ChatGPT到Sor…

【自然语言处理】Transformer中的一种线性特征

相关博客 【自然语言处理】【大模型】语言模型物理学 第3.3部分&#xff1a;知识容量Scaling Laws 【自然语言处理】Transformer中的一种线性特征 【自然语言处理】【大模型】DeepSeek-V2论文解析 【自然语言处理】【大模型】BitNet&#xff1a;用1-bit Transformer训练LLM 【自…

干货分享:搭建知识库系统的优势和技巧

如何搭建一个高效、实用的知识库系统成为很多企业绞尽脑汁的问题&#xff0c;知识库系统能够帮助我们整理、存储和快速检索各种知识信息。本文将给大家分享搭建知识库系统的优势以及技巧&#xff0c;接着往下看吧&#xff01; 一、搭建知识库系统的优势 提升工作效率&#xff1…

编辑任何场景! 3DitScene:通过语言引导的解耦 Gaussian Splatting开源来袭!

文章&#xff1a;https://arxiv.org/pdf/2405.18424 项目&#xff1a;https://zqh0253.github.io/3DitScene/ huggingface:https://huggingface.co/spaces/qihang/3Dit-Scene 场景图像编辑在娱乐、摄影和广告设计中至关重要。现有方法仅专注于2D个体对象或3D全局场景编辑&…