progrape / router Goto Github PK

页面间切换 ，快速返回多次会出现上个页面没有卸载 同时出现两个页面
console 报错
router.min.js:formatted:142Uncaught TypeError: Cannot read property 'removeChild' of null

想在程序中定向到某个页面，
比如类似 router.trigger(/question/3")

目前有类似的方法可以用吗？

谢谢~

使用go方法时，如果目标路由的bind里面有判断，然后手动修改hash，go会强制修改回来，会陷入死循环。
我觉得应该停在手动改的hash那边，或者规定不能在bind里面修改hash，至少不应该死循环。

我反复测试发现，连续打开3个窗口后，侧滑返回只能两次，在第3个窗口侧滑时看到的是第一个窗口的图像，侧滑完成后页面突然变成了第二个窗口，再次侧滑页面关闭了，应该是返回第一个窗口。
从第3个窗口侧滑返回到第二个窗口时，再侧滑没有了，但是顶上返回键点击有效。
点击顶上的返回按钮就一切都正常！

if (typeof route.bind === 'function'/* && !route.__isBind*/) {
             route.bind.call(node);
             //route.__isBind = true;
 }

修改成

if (typeof route.bind === 'function'/* && !route.__isBind*/) {
             route.bind(node);
             //route.__isBind = true;
 }

这样可以在bind函数中使用route对象，可以用来保存一些中间数据。

情况如下：
1.有A、B两个页面
2.A页面通过ajax传入数据进来
3.切换B页面（通过router来实现），再换回A页面，之前加载的AJAS数据没有了。请问怎么解决？

通过WEUI的项目中可以看出，所有的跳转页都在index里面，项目中我该如何分开呢，怎么进行外连？

比如在render里面,如果return null,就不做内容替换,保留原有的内容.

我们目前的项目遇到一个情况,从home页跳转到page1页面,在page1的render里面执行一些ajax的校验逻辑.假如校验逻辑不通过,我希望保持home的内容不变.

第一次跳转或者手动输入Url，bind的方法会执行2次，直接刷新则不会出现这个问题

打开页面一阵子不理它，再滑动页面，偶尔会出现滑不动的情况。是js框架有Bug吗？这是这个router插件有bug么？还是什么情况呢？
像这种有滚动条的页面：https://weui.io/#/cell

请问支持IE8 E9吗？

提示： 对象不支持此操作，在这一行报错
Object.defineProperty(t, "__esModule", {
value: !0
});

@progrape

在ios的微信中（其他系统未验证），进入三级页面，通过左滑返回二级页面，显示为二级页面，实际已后退至一级页面，再后退将会退出页面。可参考https://github.com/weui/weui示例中，进入tab->navbar后的后退问题

当网速比较卡时，如果使用promise，则有可能导至两个模板同时渲染到容器中。解决办法如下：

将leave(hasChildren);方法移到promise方法完成后再调用。

请问如何赋值给router加载的网页里的元素？
$("#xxx").html('123');没反应。。

render 能支持ajax调用数据，再解析模板吗，特别针对带参数的，调用ajax返回的的数据绑定模板

复现方法：
Step 1. 使用浏览器（Chrome on Mac, Safari on Mac, Safari on iOS) 打开 https://github.com/progrape/router
Step 2. 点击预览那里的链接 https://progrape.github.io/router
Step 3. 等待画面加载完成后，点击浏览器的返回按钮，此时会看到画面的数据块重复，每点击一次，多出一块数据。除非你快速点击两次返回按钮（仅Mac）。
（实际上，你点击该 issue 里 Step 2 那里的链接也有同样的效果）

由于监听到hash change立即执行go方法，而go方法在执行过程中会等待转场动画完成后再删除前页的DOM，这就导致过快点击浏览器前进或后退按钮时，与之对应的DOM元素还没有被创建或已经被删除的情况下，再执行removeChild方法抛出异常

我和官方演示一样，用的是https://github.com/progrape/router.git 做路由的，为何官方点击页面切换的时候是有左右滑动的效果，而我没有呢？

我用起来很卡顿。。。。。

setDefault('/searchbar') 无效

请问render能直接return一个URL吗？
看了API。貌似没有。
有没有一个好点的方法？

当我在页面中使用onclick="window.history.back(-1)"时，会报错找不到url
报错提示：
router.min.js:6 Uncaught Error: url was not found

当我使用bind绑定 按钮 使用go跳转的时候，就回出现页面加载了两个模块

url中的“#”号能否去掉或者自定义

或者说是初始化的时候，获取页面上的ajax页面
var toast = {
url: '/toast',
className: 'toast',
render: function () {
return getPage("/usercentertoast.html");
},
bind: function () {
$('#container').on('click', '#showToast', function () {
$('#toast').show();
setTimeout(function () {
$('#toast').hide();
}, 2000);
}).on('click', '#showLoadingToast', function () {
$('#loadingToast').show();
setTimeout(function () {
$('#loadingToast').hide();
}, 2000);
});
}
};

我这边现在在做选择修改学校信息，需要从个人中心到-->省-->市-->县-->学校，在学校页面保存之后， 返回个人中心，如果在保存之后，直接跳转到个人中心，页面是跳转了，但是点返回按钮，又返回到了学校页面，再返回，又到了县一级。
我想学校页面点保存之后直接到个人中心
如果不点保存，返回就到县页面

这个问题在过渡动画设置的比较慢时会明显。
比如我两个页面都有链接指向对方，过渡动画0.8s，点快了就会出现这个情况

@chux0519 选择用vue.js做表单很方便，能不能除了支持promise，还支持vue数据绑定？

是不是可以写成这样

// button
    var button = {
        url: '/button',
        className: 'button',
        render: function () {

            //do something query
            xxxx.query();
            return $('#tpl_button').html();
        }
    };

发现url连接参数必须跟router配置的url对应，如果参数值为空字符串或url连接多出参数，错误提示 not found 。能否输出正确的对象？ 比如 /list/:id 输出 {id:''} ,多个参数如何配置url呢

<script>
    $(function () {

        var router = new Router({
            container: '#container',
            enterTimeout: 250,
            leaveTimeout: 250
        });

        var home = {
            url: '/',
            className: 'home',
            render: function () {
                return $('#home').html();
            }
        };

        var page = {
            url: '/page',
            className: 'page',
            render: function (callback) {
                Wxui.html('/c_Gavm3qM9X.view',function(html){
                    callback(null,html);
                });
            }
        };

        router.push(home)
            .push(page)
            .setDefault('/')
            .init();
    });
</script>

<div id="container">

</div>

<div id="home" style="display:none;">
<a href="#/page">第一页</a><p>首页</p>
</div>

Wxui.html是一个$.ajax的封转.

如题

render function 是指切换页面前 至最后 return 。
相当于，我做了一些前置工作后，return 才切换页面。

基于传统前端页面思维，我想当 return 切换页面完成时，想要执行一些代码，该如何实现？
类似于原生的 window.load 方法，即页面渲染完成后，我要做一些事。

请楼主提供示例，感谢！

手机端首次访问，bind执行两次,如下，会alert两次。

var index = {
url: '/',
className: 'home',
render: function (){
return 'home';
},bind: function () {
alert(1);
}
}

rt

如题，下载下来，npm start之后，电脑风扇狂转，关闭了就好了。

Hi jf大神，目前正在使用您的git库中的router，遇到了以下问题想请教一下：
我看了您的todo的example，发现有段代码可以在bind方法中使用this获取到当前的router信息。

但是那里面是import了router.js，并不是用了您git上的router：

我在使用您git上的router的时候，在bind方法中使用this，返回的是当前的html，请问在bind方法中怎么获取当前的router信息呢？

目前我的路由有几十个，所有的模板都放到了index.html里面，组织起来不是很方便，想问问各位对于模板有什么好的组织方式

点击链接时，在go方法最后会调用一次leave去删除上一个页面，但是这个leave使用的是leaveTimeout而不是enterTimeout，如果我的enterTimeout和leaveTimeout不同的话会引起切换时间错误的问题。
应该修改成根据isBack来判断使用哪个timeout，如果是前进动作就使用enterTimeout。