今天早上主要是接着做昨天的微信端网页预览附件,听同事说当打包代码放入服务器上后,就不存在跨域问题了,也就懒得自己写接口了,那么就希望自己能一次过吧...结果写着写着,发现开发文档中关于预览文件的方法,在实际操作的时候竟然没有!也就是说,开发文档给了一个实际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. G1 GC日志:Application time: 0.8766273 seconds

    启动日志一直循环: 1.159: Application time: 0.8766273 seconds 1.160: Total time for which application threads ...

  2. web性能优化之GZIP压缩

    从服务端优化来说,通过对服务端做压缩配置可以大大减小文本文件的体积,从而使加载文本的速度成倍的加快.目前比较通用的压缩方法是启用gzip压缩.它会把浏览器请求的页面,以及页面中引用的静态资源以压缩包的 ...

  3. 分享cropper剪切单张图片demo

    <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8& ...

  4. git提交代码到码云

    日常代码一般提交到github比较多,但我还是钟爱马爸爸,没错就是码云. 码云是中文版的代码托管的网站,不存在打开网速问题,使用也蛮方便的,日常自己保存托管代码已经足够,平时使用git提交代码到码云是 ...

  5. TCP中的三次握手和四次挥手

    三次握手:目的是同步连接双方的序列号和确认号 并交换 TCP窗口大小信息. 理论上跟通话一样: a: 你听的到吗?  b: 我能听到.只需要两次就可以了,但建立连接阶段不是双向即时通信的,且最终的目的 ...

  6. CUDA 版本,显卡驱动,Ubuntu版本,GCC版本之间的对应关系

  7. C++构造函数及成员变量

    class MyClass { public: int m_age; float m_hight; MyClass() { } ~MyClass() { } MyClass(int age, floa ...

  8. Python 用hashlib。md5加密算法

    廖雪峰的官方网站学习MD5加密,网址:“http://www.liaoxuefeng.com/wiki/001374738125095c955c1e6d8bb493182103fac9270762a0 ...

  9. activemq的高级特性:消息持久订阅

    activemq的高级特性之消息持久订阅 如果采用topic模式发送的时候,mq关闭了或消费者关闭了.在启动的时候,就会收不到mq发送的消息,所以就会出现消息持久订阅. 消息持久订阅:第一:消息要持久 ...

  10. python散记

    1.AOP 将不同的类的内部中雷同的代码和重复的功能,提取出来以重用. 装饰器是一个很著名的设计模式,经常被用于有切面需求的场景,较为经典的有插入日志.性能测试.事务处理等 2.新式类,经典类 新式类 ...