【vue项目】中跳转页面

注意：此时test.html文件里，引用的所有js、css、images等路径，都要改成 /static/xxx/xxx.xx的形式，本项目中把test2.html 所引用的css文件，存放路径为：static/pages/css/test2.css，则在test2.html中的引用应该是：/static/pages/css/test2.css。例如：在public新建pages/test.htm

猫饭_ACE

4995人浏览 · 2023-06-07 15:36:21

猫饭_ACE · 2023-06-07 15:36:21 发布

一、跳转外链页面

替换当前页（重新定位当前页）：window.location.href
EX：window.location.href = “http链接”

打卡新窗口：window.open()
EX：window.open(“https://www.xxx.com”)

window.location.href 和 window.open()的区别：https://blog.csdn.net/lhban108/article/details/110929435

二、跳转项目内的html页面

1、可以通过修改url实现路由跳转；跳转到指定的路由地址

this.$router.push({
    path: "recruitment-detail",
})

2、项目根目录里，如果有public文件夹，则直接放进public文件夹里，与index.html 同级开始，按照项目路径访问。
例如：在public新建pages/test.html, 则：浏览器访问路径是： http://host:port/pages/test.html
注意，此时test.html文件里引用的所有js/css/image等路径，都要改成项目根目录开始的绝对路径的形式。

3、如果项目根目录没有public,但是有static文件夹，则同样把/pages/test.html放进 static文件夹里，按照static的绝对路径访问
例如：在static中新建 pages/test2.html, 则浏览器访问路径是：http://host:port/static/pages/test2.html
注意：此时test.html文件里，引用的所有js、css、images等路径，都要改成 /static/xxx/xxx.xx的形式，本项目中把test2.html 所引用的css文件，存放路径为：static/pages/css/test2.css，则在test2.html中的引用应该是：/static/pages/css/test2.css

参考链接：https://www.cnblogs.com/kebaoye/p/15970258.html

三、项目中的html页面乱码问题的处理

1、造成乱码的原因
①比如网页源代码是gbk的编码，而内容中的中文字是utf-8编码的，这样浏览器打开即会出现html乱码。反之网页是编码utf-8，内容是gbk也会出现乱码。

②html网页编码是gbk，而程序从数据库中调出呈现是utf-8编码的内容也会造成编码乱码。

③浏览器不能自动检测网页编码，造成网页乱码。

2、解决乱码方法
在html头标签中加入

<meta charset="utf-8">

EX:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

参考链接：https://blog.csdn.net/qq_41046162/article/details/128557979

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^