记录vue3写项目遇到的奇奇怪怪怪的小问题(持续更新)

news/2024/11/16 11:53:02/文章来源:https://www.cnblogs.com/changyuanyuyi/p/18390248
<el-table:header-cell-style="{ color: '#fff', background:'rgba(78, 131, 211, 0.8)' }"// 设置table表头样式>
</el-table>

表头居中

:cell-style="{text-align:center}" 

表行居中

 <el-table-columnprop="xxx"align="center">
</el-table-column>

控制台报错

Missing semi-colon or unrecognised media features on import

错误代码:@import '~@/styles/layout.less'正确代码: @import '~@/styles/layout.less';

错误原因仅仅是一个 ; 的差别!

Vue3无法动态绑定图片问题

这段代码没有报错,图片可以显示
<img src="@/assets/images/banner.png" >可见我的路径没有问题,可当我把它改为动态路径时,
图片不可以显示:<img :src="url">
const url = ref('@/assets/images/banner.png')问题分析:打开F12,点击Network部分,可见图片是存在的![控制台](https://img2024.cnblogs.com/blog/3508433/202408/3508433-20240831143124566-1437834976.png)而正确的信息应为: 状态码为304,路径为“http://localhost:5173/src/assets/images/banner.png”对比可见:正确路径里面多了一个src,而其他两个写法都没有,因此是路径解析问题解决方法:把相对路径改为以src开头的格式即可<img :src="url">
...
const url = ref('src/assets/images/banner.png')

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

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

相关文章

如何安装peiqi文库

一:安装包下载 方法一:hithub上搜索peiqi方法二:使用自己搭建的ubuntu,kali,linux都可。我用的ubuntu 输入命令:git clone https://gitee.com/peiqi0/PeiQi-WIKI-Book.git二:查看安装情况 1:ls查看是否安装成功2:cd 进入3:安装nmp sudo apt-get install npm4:通过np…

040.CI4框架CodeIgniter,使用Response实现前后端分离并返回JSON

01、BaseController.php代码如下:<?phpnamespace App\Controllers;use CodeIgniter\Controller; use CodeIgniter\HTTP\CLIRequest; use CodeIgniter\API\ResponseTrait; use CodeIgniter\HTTP\IncomingRequest; use CodeIgniter\HTTP\RequestInterface; use CodeIgniter\…

使用 Quickwit 的搜索流功能为 ClickHouse 添加全文搜索

本指南将帮助您使用 Quickwit 的搜索流功能为知名的 OLAP 数据库 ClickHouse 添加全文搜索。Quickwit 暴露了一个 REST 端点,可以极快地(每秒最多 5000 万条)流式传输匹配搜索查询的 ID 或其他属性,ClickHouse 可以轻松地使用它们进行连接查询。 我们将采用 GitHub 存档数据…

《周易》:大衍筮法

@目录前言1.爻与卦1.1 阴爻与阳爻1.2 经卦1.2.1 先天八卦图1.3 别卦1.3.1 六爻2.大衍筮法2.1 天地之数与大衍之数2.1.1 天地之数2.1.2 大衍之数2.2 大衍筮法的操作2.2.1 流程2.2.2 第一组操作的准备2.2.3 分而为二2.2.4 挂一以象三2.2.5 揲之以四,以象四时过揲归奇于扐一挂二扐…

【阅己书城】逆向生成代码

1、配置renren-generator # application.ymlserver:port: 80 # mysql spring:datasource:type: com.alibaba.druid.pool.DruidDataSource#MySQL配置driverClassName: com.mysql.cj.jdbc.Driverurl: jdbc:mysql:///:3306/yueji_pms?useUnicode=true&characterEncoding=UTF-…

SimpleTranslationAIAgent:基于C#与LLM的翻译AI Agent

基于C#与LLM通过简单对话即可实现文件到文件的翻译任务 该软件是MIT协议完全开源免费的,但是调用LLM的API可能需要费用,但是没关系,赛博菩萨硅基流动与智谱AI等都有免费的模型可调了。 这个Translation AI Agent只是一个简单的AI Agent示例应用,可能很多人都不需要它。 开源…

SimpleTranslationAIAgent借助SiliconCloud API 构建自己的专属翻译助手

SimpleTranslationAIAgent介绍 SimpleTranslationAIAgent是一款基于C#与LLM通过简单对话即可实现文件到文件的翻译任务的简单应用,基于WPF与Semantic Kernel构建。 该软件是MIT协议完全开源免费的,但是调用LLM的API可能需要费用,但是没关系,赛博菩萨硅基流动有免费的模型可…

autodock vina后处理分析

拆分对接结果vina_split --input result.pdbqt --ligand complex/lig使用mv命令批量修改文件名,把01-09修改成1-9,便于批量处理for i in `seq 1 9`; do > mv "lig0${i}.pdbqt" "lig${i}.pdbqt" > done使用Openbabel把pdbqt转成pdbfor i in `seq …

039.CI4框架CodeIgniter,封装Model模型绑定数据库的封装

01、ModelBase.php代码如下:<?phpnamespace App\Models;use CodeIgniter\Database\ConnectionInterface; use CodeIgniter\Model; use CodeIgniter\Validation\ValidationInterface;class ModelBase extends Model {var $Db;function __construct(ConnectionInterface $db…

洛谷 P11011 点的覆盖

洛谷 P11011 点的覆盖 题意 给定一个四边平行于坐标轴的矩形 \(A\),给定 \(n\) 个在矩形 \(A\) 内部(可能在边缘上)的点。 求有多少个 \(A\) 的子矩形覆盖了所有 \(n\) 个点(允许在边缘上)。 所有坐标都是整数。 思路 求出:\(X_1=\max_{i=1}^n x_i\),\(X_2=\min_{i=1}^n…

使用 nuxi build-module 命令构建 Nuxt 模块

title: 使用 nuxi build-module 命令构建 Nuxt 模块 date: 2024/8/31 updated: 2024/8/31 author: cmdragon excerpt: nuxi build-module 命令是构建 Nuxt 模块的核心工具,它将你的模块打包成适合生产环境的格式。通过使用 --stub 选项,你可以在开发过程中加快模块构建速度…

美团面试:10Wtps,Kafka为啥那快?kafka 零复制 Zero-copy 如何实现?

文章很长,且持续更新,建议收藏起来,慢慢读!疯狂创客圈总目录 博客园版 为您奉上珍贵的学习资源 : 免费赠送 :《尼恩Java面试宝典》 持续更新+ 史上最全 + 面试必备 2000页+ 面试必备 + 大厂必备 +涨薪必备 免费赠送 :《尼恩技术圣经+高并发系列PDF》 ,帮你 实现技术自由,…