关于金格WebOffice2015是什么就不说了,可以自行百度下,最近在调研这个东西,所以下了试用版集成到vue项目使用。
金格的说明文档写的很模糊,看完还是不知其所以然。下面就具体说下WebOffice2015集成到vue项目的方式:
1、随便下载一个试用版
http://www.goldgrid.com/jinge_download/Index.aspx?num=5&firstid=11&flag=0&secondid=67
解压后的文件,可以直接把这个文件当做一个插件放置到vue的某个目录下待后续使用,我放置到static中了。
js文件中的iWebOffice2015.js主要是根据不同的浏览器环境来渲染,并为进行了适当的配置。
WebOffice.js是WebOffice2015对象的一些方法。
2、在index.html中引入WebOffice.js
3、渲染、创建WebOffice2015对象并进行适当的配置
WebOffice2015通过集成
这里我对iWebOffice2015.js稍微做了更改,第一点,绿圈处的闭合标签是后来加上去的,官方下载的文件绿圈处少一个闭合标签,导致页面无法正常渲染,第二点,将拼接好的字符串暴露出来,并在vue文件中import通过创建vue实例手动挂载来渲染。
最后看下集成后打个本地word的效果
今天的文章金格插件iweboffice2009_vue项目在浏览器打开新页面[通俗易懂]分享到此就结束了,感谢您的阅读。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/88734.html
![金格插件iweboffice2009_vue项目在浏览器打开新页面[通俗易懂]插图1 2c30946cff789b36e72fce1e78da6a6a.png](https://img.bianchenghao.cn/app/bianchenghao_cn/b19a8e4ecb364aacba0ac9d0b09c4525.png)
![金格插件iweboffice2009_vue项目在浏览器打开新页面[通俗易懂]插图3 b054c9fd1f236743c60bc2a327cffbf6.png](https://img.bianchenghao.cn/app/bianchenghao_cn/49244b36cf1f47e58392fac659c477ff.png)
![金格插件iweboffice2009_vue项目在浏览器打开新页面[通俗易懂]插图5 472e4b73d7cc77a59fedd993888a97d6.png](https://img.bianchenghao.cn/app/bianchenghao_cn/e08d4205478d4016a4088b4eeb8ced93.png)
![金格插件iweboffice2009_vue项目在浏览器打开新页面[通俗易懂]插图7 942e2df15a22c6c540befaf00e3bddae.png](https://img.bianchenghao.cn/app/bianchenghao_cn/98159194a5994615ba584afa07a6fdab.png)
![金格插件iweboffice2009_vue项目在浏览器打开新页面[通俗易懂]插图9 aec04fbc4e5ec056e976c6f3ef7441a8.png](https://img.bianchenghao.cn/app/bianchenghao_cn/9f31d910a56d41b0be8bc815118c66b6.png)