今天早上主要是接着做昨天的微信端网页预览附件,听同事说当打包代码放入服务器上后,就不存在跨域问题了,也就懒得自己写接口了,那么就希望自己能一次过吧...结果写着写着,发现开发文档中关于预览文件的方法,在实际操作的时候竟然没有!也就是说,开发文档给了一个实际sdk中不存在的方法,真的是无语死了,结果搞来搞去一早上加昨晚都白搞了...那么还能怎么办呢,汇报了一下情况之后选择别的方法呗。首先pc端及app端的预览页面采用的是window.open的形式,而这种形式是会被微信自带浏览器给屏蔽的!

  所以只好开始面向搜索引擎编程,一开始我是想在详情列表中,内嵌一个iframe来展示预览内容,发现奇丑无比,自适应大小也不是很会调,就放弃了这个方案。后来就打算碰碰运气,看看用最简单直接的办法,location.href = url来打开要预览的文件。谁知道这个方法竟然过了...这时候我才明白微信浏览器应该是可以自动打开各类主流文档和图片的。虽说预览效果达到了,但bug也出现了,点击了自带的返回按钮后,退出到列表详情页面,因为没有请求参数,导致页面没有数据,一片空白。然后大概想了一下,需要做一个页面,这个页面要有一个返回功能,带参数用来再次请求数据,然后内嵌一个组件(其实不可行)或子页面来显示预览内容。然后很快做出了一个带返回按钮的预览界面。子页面用的还是iframe...将要预览的文件的url地址传入该页面,绑定在iframe的src属性上,调整一下子页面大小,就大功告成了。返回按钮同事说他来做,就不关我事了~

  然而快下班时,发现返回按钮这个设定不可行,因为如果采用返回按钮的形式,那么再次点击自带的返回按钮,则会依次跳转回之前的页面,这就很蛋疼,意味着始终会跳转回空白的详情页面。那么又要重新想办法了,既然不能用返回按钮,那么就只能使用自带的返回按钮了。然后我想到了一般的页面都有缓存机制,于是我就去查在Vue中的缓存机制,果然,可以通过设置缓存,来使返回的页面带有数据。在和同事交流之后决定采用这种方式。果然,第一次使用的东西一般总会有bug。在简单的配置了App.vue和index.js(路由设置下meta属性的keepAlive属性)之后,发现从预览页面返回到详情页面是有数据的,然而从主页再进入详情页则不会刷新数据。经过了解,大概是缓存页面后,vue页面的生命周期和钩子函数有改动,看来这部分特别重要需要去深入学习一下,改天再单发博客记录一下心得(挖坑)。再然后,也看到源来缓存的属性,是可以动态设置的,可以根据路由的切换来变换是否缓存,那么希望明天可以通过了解这方面来解决需求。

  然后下午断断续续的做了昨天要求做的静态页面,因为根本无法看懂组长的前端组件,不知道怎么使用,所以自己通过ydui临摹了一个出来。在经过同事的谆谆教诲之后,终于看明白了组长的自定义组件,打算明天如果没什么事,就把静态页面用我们自己的组件库来写(挖坑)。想起来还有SSM框架搭建步骤和git常用命令没有写,头很大,只希望可以还有很多时间来学习,只有一技之长,才能摆脱焦虑。

Terence Xie

2018.7.25 周三 23:51

TW实习日记:第八天的更多相关文章

  1. TW实习日记:前三天

    今天是2018年7月20号,周五.从周一开始实习到现在,终于想起来要写日记这种东西了,可以记录一下自己这一天所学所做所知也是蛮不错的.先简单总结一下自己的大学生活吧,算是多姿多彩,体验了很多东西.在大 ...

  2. TW实习日记:第九天

    这两天有点忙,要改前端网页和加需求上去.所以昨天说的Vue缓存机制也没看,所以打算现在列个挖了的坑的清单: Vue缓存机制.生命周期和钩子函数 使用项目组自用组件来重写静态页面 SSM框架搭建.整合流 ...

  3. TW实习日记:第31-32天

    不知不觉的,实习的净工作天数,已经都超过一个月了.因为对工作内容不是很满意,所以打算月底离职,也不知道是公司太缺人还是我真的能干活,领导竟然三番两次找我让我再考虑...明天又要找我了,哎...随机应变 ...

  4. TW实习日记:第四天

    第四天 早上第一件事就是和组长说前一天的需求的事,简而言之就是两个导航栏不属于一个标签内,自定义导航栏属于<body>下的<header>,微信顶部的则是<head> ...

  5. TW实习日记:第十天

    今天任务很简单,就是出品项目的时间轴显示页面和动态路由设置.其实时间轴页面很快就做完了,在做完处理完数据之后,然而有很多细节需要打磨,这就又考验了我面向搜索引擎编程的能力,根据需求百度了很多css的样 ...

  6. TW实习日记:第七天

    今天早上,将项目的两个企业微信接口:登录和应用消息发送接口,做了最后的收尾工作,把目前我能解决的问题算是基本都解决了.早上还开了一个会,大意是组长封装了许多组件叫我们使用,在不断的使用中打磨组件的可用 ...

  7. TW实习日记:第六天

    今日的一整天都是在开发微信相关的接口,因为项目的系统是嵌在企业微信中,所以不可避免的要产生微信UserID和企业系统ID的匹配关系,那么就需要用手机号或是邮箱这种两边都存在的唯一参数进行匹配.然后再将 ...

  8. TW实习日记:第五天

    今天可以说是非常忙的一天了,要再项目中实现微信相关的功能:授权登录以及扫码登录,还有就是自建应用的发送消息.首先功能代码其实在经过了几天的学习之后并没有很难,但是最让我难受的是在项目中去加代码,首先s ...

  9. TW实习日记:第28天

    同前两天一样,等接口,开发,调试接口.重复地做着低级代码得搬运工作,确实挺没意思的.怪不得有些人一直说写低级代码很无聊,没有创造性和成就感.31号准备溜了,还是好好复习准备秋招吧. 挖坑清单: Vue ...

随机推荐

  1. IntelliJ IDEA隐藏不想看到的文件或文件夹

    打开IntelliJ IDEA,File -> Settings -> Editor -> File Types 在红框部分加上你想过滤的文件或文件夹名

  2. winrar 弹窗处理

    https://www.rarlab.com/ 1.下载英文版 2.把下面这段code文本复制到一个新建的记事本txt文档中,然后另存为rarreg.key文件,注意后缀名.txt改为.key才行. ...

  3. Oracle 11g DataGuard搭建(一) - 单节点到单节点

    (一)DataGuard概要 DataGuard中文称为”数据卫士“,提供了数据库高可用性.数据保护和灾难恢复的功能.DataGuard通过建立primary数据库和standby数据库来确立参照关系 ...

  4. Oracle 数据库备份和恢复配置

    可能的失败及其解决方法 失败类型 我们坑你遇到的失败或错误分为两大类:物理和逻辑.物理错误一般是硬件错误或使用数据库的应用程序中的软件错误,而逻辑错误一般在终端用户级别(数据库用户和管理员). 按从轻 ...

  5. 关于Oracle的认识

    一.Oracle认识: 1.安装时的全局数据库Orcl可以使用吗?可以的 2.Oracle相关服务: 3.数据库与用户,表空间的关系“ 4.切换数据库 5.关于命令:sqlplus 6\

  6. iOS开发UI篇 -- UISearchBar 属性、方法详解及应用(自定义搜索框样式)

    很多APP都会涉及到搜索框,苹果也为我们提供了默认的搜索框UISearchBar.但实际项目中我们通常需要更改系统默认搜索框的样式.为了实现这一目标,我们需要先搞懂 UISearchBar 的属性及方 ...

  7. angular入门一之环境安装及项目创建

    angular入门一之环境安装及项目创建 1.安装node.js 下载,安装,在终端测试安装是否成功:node -v(查看nodejs版本) npm -v(查看npm版本) 下载地址:https:// ...

  8. 记如何用树莓派3开一个无线AP

    开热点 忘掉自己手动配置吧 create_ap git clone git@github.com:oblique/create_ap.git cd create_ap sudo make instal ...

  9. linux 命令 sort

    Linux下的sort排序命令详解(一) 1 sort的工作原理 sort将文件的每一行作为一个单位,相互比较,比较原则是从首字符向后,依次按ASCII码值进行比较,最后将他们按升序输出. [zook ...

  10. JavaWeb开发使用jsp还是html做前端页面

    一.概述 刚开始学习Javaweb开发的小伙伴都有一个疑惑:用jsp开发前端还是用HTML开发前端呢? 这个疑惑的来源主要是:刚接触完前端但又不深入学习js,接着学习jsp,发现老师们都一直用着jsp ...