<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> </head> <body> <div id="app"> <h1>{{data.name}}</h1> <img src="../static/img/sea.jpg" alt="" /> </div> </body> </html> <script src="https://cdn.jsdelivr.net/npm/vue@3.0.11/dist/vue.global.prod.js"></script> <script src="https://unpkg.com/axios/dist/axios.min.js"></script> <script src="https://cdn.bootcss.com/qs/6.7.0/qs.min.js"></script> <script> const { createApp, reactive, getCurrentInstance } = Vue; const app = createApp({ setup() { const data = reactive({ name: "aa", }); getInformation(); //方法1 function getInformation() { //方法的实现 data.name = "引入的html文件"; } // 方法2 const handleClick = (val) => { //方法的实现 }; return { data, handleClick, }; }, }); app.mount("#app"); </script>
Vue3项目中引入html页面
2023-11-09
343
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《
阿里云开发者社区用户服务协议》和
《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写
侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介：
Vue3项目中引入html页面
目录
相关文章
|
4天前
|
人工智能
程序员
UED
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
56
21
22
|
3天前
|
前端开发
JavaScript
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
25
14
15
|
1天前
|
3天前
|
JavaScript
安全
API
iframe嵌入页面实现免登录思路（以vue为例）
通过上述步骤，可以在Vue.js项目中通过 `iframe`实现不同应用间的免登录功能。利用Token传递和消息传递机制，可以确保安全、高效地在主应用和子应用间共享登录状态。这种方法在实际项目中具有广泛的应用前景，能够显著提升用户体验。
27
8
8
|
4天前
|
资源调度
JavaScript
前端开发
|
2月前
|
前端开发
测试技术
定位技术
如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计，再到HTML结构搭建与CSS样式设计，最后实现具体页面并进行优化提升，全面覆盖了网站开发的关键步骤
本文深入介绍了如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计，再到HTML结构搭建与CSS样式设计，最后实现具体页面并进行优化提升，全面覆盖了网站开发的关键步骤。通过实例展示了主页、关于我们、产品展示、新闻动态及联系我们等页面的设计与实现，强调了合理布局、美观设计及用户体验的重要性。旨在为企业打造一个既专业又具吸引力的线上平台。
96
7
7
|
2月前
|
2月前
|
JavaScript
前端开发
Java
|
24天前
|
JavaScript
|
4天前
|
存储
设计模式
JavaScript
热门文章
最新文章
1
vue使用iconfont图标
2
vue3使用pinia中的actions，需要调用接口的话
3
Figma-Low-Code：快速将Figma设计转换为Vue.js应用，支持低代码渲染、数据绑定
4
【Vue.js】监听器功能（EventListener）的实际应用【合集】
5
Vue.js应用结合Redis数据库：实践与优化
6
iframe嵌入页面实现免登录思路（以vue为例）
7
创建vue3项目步骤以及安装第三方插件步骤【保姆级教程】
8
一个好看的小时钟html+js+css源码
9
Vue 组件化开发：构建高质量应用的核心
10
HTML在线扫雷游戏网页源码
1
vue中使用echarts绘制双Y轴图表时，刻度没有对齐的两种解决方法
793
2
在vue页面引入echarts,图表的数据来自数据库 springboot+mybatis+vue+elementui+echarts实现图表的制作
200
3
WEB前端三大主流框架：React、Vue与Angular
340
4
循序渐进VUE+Element 前端应用开发(10）--- 基于vue-echarts处理各种图表展示
90
5
前端核心框架Vue指令详解
50
6
Vue项目使用ECharts实现图表
100
7
如何在vue添加echarts图表
94
8
使用Vue+ ECharts进行动态图表展示
296
9
Vue引入Echarts图表的使用
89
10
探索前端开发框架：React、Angular 和 Vue 的对决(四)
93