vue 利用hash值实现刷新无跳转页面

//子组件一定要有name值
<template><div><ul><li @click="aaa(i)" v-for="(v, i) in nav" :key="i">{{ v }}</li><components :is="active"></components></ul></div>
</template><script>
import One from './One'
import Two from './Two'
import Three from './Three'
export default {mounted() {let str = window.location.hashthis.active = str.replace('#', '')},data() {return {nav: ['one', 'two', 'three'],list: [One.name, Two.name, Three.name],active: 'One',}},components: {One,Two,Three,},methods: {aaa(i) {this.active = this.list[i]window.location.hash = this.list[i]},},
}
</script>

 

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

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

相关文章

阿里云视频云「 vPaaS 」演绎了怎样的音视频应用开发「未来图景」

简介&#xff1a;前瞻音视频平台的演进未来 vPaaS是阿里云视频云最新推出的低代码音视频应用开发产品&#xff0c;其中&#xff0c;vPaaS低代码音视频工厂&#xff0c;彻底打破了音视频应用的繁冗技术开发壁垒&#xff1b;vPaaS视频原生应用开发平台&#xff0c;全新定义了音视…

鲲鹏开发者创享日2022:鲲鹏全栈创新 与开发者共建数字湖南

由华为推出的面向鲲鹏计算产业全栈开发者的系列活动——鲲鹏开发者创享日2022于8月5日在长沙成功举办。这场被称为开发者“技术嘉年华”的峰会&#xff0c;汇聚了国内顶尖技术大咖、科研带头人、知名企业技术专家及高校开发者&#xff0c;描绘了计算产业发展趋势和蓝图&#xf…

MySQL 深潜 - MDL 锁的实现与获取机制

简介&#xff1a;本文将介绍在 MDL 系统中常用的数据结构及含义&#xff0c;然后从实现角度讨论 MDL 的获取机制与死锁检测&#xff0c;最后分享在实践中如何监控 MDL 状态。 作者 | 泊歌 来源 | 阿里技术公众号 一 背景 为了满足数据库在并发请求下的事务隔离性和一致性要求…

深度解说阿里云 Serverless Kubernetes

简介&#xff1a;听阿里云技术专家聊聊 Serverless Kubernetes 一路走来的发展史&#xff0c;看看它是如何做到兼容 Kubernetes 使用方式的同时&#xff0c;拥有免运维和极致弹性等特点~ 作者 | 陈晓宇&#xff08;阿里云技术专家&#xff09; 策划 | 褚杏娟 伴随着云原生的…

理清 HTTP 之下的 TCP 流程,让你的 HTTP 水平更上一层

作者 | 神说要有光来源 | 神光的编程秘籍大家都知道 HTTP 的底层是 TCP&#xff0c;但是可能仅限于知道&#xff0c;并不是真正理解它们的关系。平时我们用 chrome devtools 的 Network 工具也只是能分析 HTTP 请求&#xff1a;TCP 层的东西看不见摸不着的&#xff0c;所以对它…

基于 EventBridge 构建 SaaS 应用集成方案

简介&#xff1a;事件源是事件驱动的基石&#xff0c;如何获取更多事件源也是 EventBridge 一直在探索和尝试的方向。针对市场上其他云厂商和垂直领域的 Saas 服务&#xff0c;EventBridge 发布了 HTTP Source 能力&#xff0c;提供简单且易于集成的三方事件推送 &#xff0c;帮…

无缝融入 Kubernetes 生态 | 云原生网关支持 Ingress 资源

简介&#xff1a;Kubernetes 一贯的作风是通过定义标准来解决同一类问题&#xff0c;在解决集群对外流量管理的问题也不例外。Kubernetes 对集群入口点进行了进一步的统一抽象&#xff0c;提出了 3 种解决方案&#xff1a;NodePort、LoadBalancer 和 Ingress。 作者&#xff1…

阿里云 AI 编辑部获 CCBN 创新奖,传媒行业解决方案背后的黑科技

简介&#xff1a;视频云驱动智媒创新 5 月 27 日&#xff0c;CCBN&#xff08;第二十八届中国国际广播电视信息网络展览会&#xff09;在北京隆重召开&#xff0c;在本次的 “CCBN 年度创新奖” 评选中&#xff0c;阿里云视频云凭借 AI 编辑部的传媒行业专业解决方案获得 CCBN …

云原生正在吞噬一切,开发者该如何应对?

十年前&#xff0c;Netscape创始人、硅谷著名投资人马克安德森&#xff08;Marc Andreessen&#xff09;预言“软件正在吞噬世界”&#xff1b;数年后&#xff0c;软件里90%以上的代码都是开源代码&#xff0c;“开源正在吞噬软件”&#xff1b;如今&#xff0c;“云原生吞噬开…

阿里云视频云 Retina 多媒体 AI 体验馆开张啦

简介&#xff1a;带你体验视频更多可能 带你体验视频更多可能 海量视频管理难度大&#xff1f;翻库检索特定人物费时费力&#xff1f;视频内容剪辑效率低&#xff1f;您的得力助手“Retina多媒体AI”体验馆已上线。带你感受视频AI黑科技&#xff0c;开启极致智能体验。 1、智…

一篇文章了解 Docker 的安装、启动以及工作原理!

作者 | 是泡泡来源 | CSDN博客Docker 浅谈1.1 Docker 为什么出现我们知道&#xff0c;传统的项目开发和运维是两套环境&#xff0c;而且要一一配置环境并且有的时候更新还会导致服务不可用&#xff0c;这就很麻烦了&#xff0c;那么有没有一种很方便不用这么麻烦的技术可以一键…

技术解读:英特尔 x86 平台上,AI 能力是如何进行演进的?(附PPT)

简介&#xff1a;AI 生态系统是怎样的&#xff1f;其中又有哪些关键技术&#xff1f; AI 计算力的指数增长意味着&#xff0c;为了解决越来越复杂的用例&#xff0c;即使是 1000 倍的计算性能增长也很容易被消耗。因此&#xff0c;需要通过软件生态系统的助力&#xff0c;才能…

Apsara Stack 技术百科 | 浅谈阿里云混合云新一代运维平台演进与实践

简介&#xff1a;随着企业业务规模扩大和复杂化及云计算、大数据等技术的不断发展&#xff0c;大量传统企业希望用上云来加速其数字化转型&#xff0c;以获得虚拟化、软件化、服务化、平台化的红利。在这个过程中&#xff0c;因为软件资产规模持续增大而导致的软件开发运维和IT…

Mendix:企业成功执行数字化转型的9个因素

作者 | Mike Tarentino 供稿 | Mendix 如果咨询一百家公司有关数字化转型战略的定义和规划&#xff0c;很大可能会得到一百种不同的答案。然而&#xff0c;企业对于数字化转型的重要性已达成一种共识。不过&#xff0c;在实际情况中&#xff0c;很多企业在数字化转型的执行上举…

Java应用结构规范

简介&#xff1a;在Java程序开发中&#xff0c;命名和应用分层无疑是广大后端同胞的两大“痛点”&#xff0c;本文提供一种基于领域模型的轻量级应用分层结构设计&#xff0c;供大家参考。下面按分层结构、分层明细、调用关系、各层规范和通用代码工具展开介绍。 作者 | 阿卓 来…

es6 Symbol iterator接口

Symbol定义&#xff1a;一种新的原始数据类型&#xff0c;表示独一无二的值&#xff0c;是一种类似字符串的数据类型 特点&#xff1a; 值是唯一的&#xff0c;用来解决命名冲突的问题 值不能与其他数据进行运算 注意点 Symbol 值作为属性名时&#xff0c;该属性是公有属性…

Gartner:2022年全球半导体收入增长预计将放缓至7%,远低于2021年26.3%

2022年来自个人电脑的半导体收入将下降5.4% 供稿 | Gartner 出品 | CSDN云计算 根据Gartner的最新预测&#xff0c;2022年全球半导体收入预计将增长7.4%&#xff0c;相比上一季度预测的13.6%有所下降并且远低于2021年的26.3%。 Gartner研究业务副总裁Richard Gordon表示&#…

es6 Promise,生成器函数,async

生成器函数 简单使用&#xff1a; // 生成器就是一个特殊的函数// 异步编程 纯回调函数 node gs ajax mongodbfunction* gen() {// console.log(111);yield 一只没有耳朵;// console.log(222);yield 一只没有尾巴;// console.log(333);yield 真奇怪;// console.log(444);}let …

Linux 中的管道是什么?管道重定向是如何工作的?

作者 | 刘光录来源 | TIAP我们在命令行中经常会用到类似 cmd0 | cmd1 | cmd2 的写法。其实&#xff0c;这是管道重定向&#xff08;pipe redirection&#xff09;&#xff0c;用于将一个命令的输出作为输入重定向到下一个命令。那么&#xff0c;你知道它具体是怎么工作的吗&…

AliRTC 开启视频互动 “零计算” 时代

简介&#xff1a;在 2021 云栖大会《产业视频化创新与最佳实践》视频云主题论坛中&#xff0c;阿里云智能高级技术专家在《AliRTC 开启视频互动 "零处理" 时代》的主题演讲中&#xff0c;发布了阿里云视频云下一代实时交互解决方案 —RTC “零处理”&#xff0c;同时…