使用 pjax 局部刷新时,你们是怎么处理 js 代码的?

2017-02-09 22:28:15 +08:00
 yumemor

现在加载局部页面几乎抛弃了 iframe ,使用 jquery load 或者 pjax 来加载,但是局部页面上面的 js 逻辑代码你们是怎么处理的呢??

方案一:全局实现 之前有看过 github 的实现,他们加载局部页面的时候不携带 js 代码。应该是放在全局页面进行处理的,但是这样的话 有些局部页面中的组件需要等待加载后才能初始化 难道每一次加载局部页面都要去初始化一次呢? 还有把所有局部页面的逻辑放在全局中 会不会不好维护呢?

方案二:局部实现 最简单粗暴, 把局部页面中的逻辑 js 放在局部页面中,

<div class='container'>
	Hello
</div>

<script>
	$(function(){
		$('.container').html('World')
	})
</script>

这样看起来 js 代码比较好维护,但是在浏览器中每点击一次都会重复的加载一次 js 代码,如果有 on 事件的话会重复进行添加,要解决重复添加 必须在 on 事件之前 取消一次事件绑定。 因为 js 加载到浏览器中没办法进行释放。

个人感觉第一种方案比较合理,但是不方便维护和开发,第二种方案简单粗暴 但是隐藏的问题很多

现在 vue 和 angular 好像都是加载局部页面不加载 js 代码 ,所以请教下各位。

8848 次点击
所在节点    问与答
5 条回复
MinonHeart
2017-02-09 23:50:15 +08:00
全局实现用委托就可以了
2 的话,你更新不会把 div 替换掉?替换就没有重复绑定的问题了。
最好把逻辑层和行为层(那些事件)分开,事件一般只要绑定一次就行了
yimity
2017-02-11 20:56:46 +08:00
第一没有所谓的 pjax ,第二,第一种方案推荐。好维护,初始化等逻辑都是在 JS 中控制。完全有你
yumemor
2017-02-15 15:37:15 +08:00
yimity
2017-02-16 08:14:41 +08:00
@yumemor 呵呵,你认为是就就好。
yumemor
2017-02-17 00:20:38 +08:00
@yimity 这个东西吧 其实是各个技术相加的简称, ajax + history.pushState = pjax ,无非就是一个局部加载+浏览器路径控制 叫什么名字都无所谓 pjax 是新技术和旧技术的结合名字 存在即合理。

要说名字别人没有起好 去 github 提 issue 吧。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/339419

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX