HTML5标准制订的两大公司劳燕分飞

2012/07/23 · HTML5 ·
HTML5

来源:雷锋网

据 i-programmer 
报导,HTML5正规章制度定组织WHATWG与W3C因为意见上的异样而分裂。这象征从此将会有五个版本的HTML5:即“规范版”和”living”版(活典型)。

趁着新本领的出席,WHATWG公布为HTML制作新的“living”标准。WHATWG以为W3C做法过于缓慢,W3C的这种缓慢的制订办法将会花费越多的小时。实际上W3C或多或少的舍弃了HTML,04年时便把HTML交给WHATWG,把越来越多的注意力放在XML特别是XHTML上。但越来越多的顾客依旧想一而再选取HTML,只但是希望有所立异罢了。

图片 1

WHATWG专业人士在文告中写道:

近来,WHATWG和W3C在HTML5职业上的冲突更大。WHATWG专一于开荒进取规范的HTML5格式及相关技术,并反复的改良标准中的错误。而W3C则想依照本人的开辟进程制作出“规范版”HTML5正经,宣布以后不容许退换,错误也无可奈何改正,所以我们决定分别研究开发。

WHATWG和W3C自二〇〇二年便开始球组织作,07年时W3C还运用WHATWG的HTML5专门的工作。但多年来那七个组织都有技巧争论,现在是根本相背而行了。W3C正铺排制订贰个简练而清晰的科班,这几个正式被WHATWG当成是“living”标准的“快速照相版”。由于摆脱了W3C的程序步骤,WHATWG的“living”标准制订很恐怕会涨价。

图片 2

前HTML5规范的编写制定职员伊恩Hickson说:“living版可以凭就算用者的举报不断立异,所以大家提议浏览器开荒者来行使。而W3C版本一旦制定之后出现了不当也迫于勘误。然则并非说标准版不佳,WHATWG灵活的翻新能够让顾客得到更加好心得,W3C的典型版在专利授权、左券条目等不容许私自改动的地方更有优势。”

由此看来对于HTML5的腾飞开辟者并不一定是个坏新闻,尽管HTML5专门的学业的定义变得复杂了些,但HTML5的正式也一向不公布过。笔者预计Chrome和Firefox会更愿意尝试WHATWG的新规范,而微软会具体观看哪一个正经更契合他们的产品开垦利润再做出选拔。早在当年一月,HTML5的标准就起来爆发变化,Apple集团的程序员说正在为W3C编写制定标准,而微软的技术员则搜索新的编写职员。

事已至此,从今后启幕,你要思量哪贰个专门的学问的HTML5更切合您了。

 

赞 收藏
评论

图片 3

深入浅出妙用 Javascript 中 apply、call、bind

2015/09/24 · JavaScript
· 4 评论 ·
apply,
bind,
call

本文作者: 伯乐在线 –
chokcoco
。未经作者许可,禁止转发!
应接参预伯乐在线 专辑作者。

这篇小说实在是很难下笔,因为网络有关作品无尽。

偶合的是前几日看到阮老师的一篇文章的一句话:

“对自己的话,博客首先是一种知识管理工科具,其次才是流传工具。作者的本事作品,首要用来整理本身还不懂的学问。小编只写那一个自个儿还不曾完全调节的事物,这一个自身掌握的东西,往往没有引力写。炫丽未有是自己的胸臆,好奇才是。”

对于那句话,不能援救越多,也让笔者下决心好好写那篇,英特网小说虽多,相当多复制粘贴,且晦涩难懂,小编盼望能够透过那篇小说,可以清晰的升迁对apply、call、bind的认知,何况列出一些它们的妙用加深纪念。

   apply、call

在 javascript 中,call 和 apply
皆觉得着改动有个别函数运转时的上下文(context)而留存的,换句话说,正是为着改变函数体内部
this 的指向。

JavaScript
的一大特色是,函数存在「定义时上下文」和「运转时上下文」以及「上下文是能够变动的」那样的概念。

先来一个板栗:

JavaScript

function fruits() {} fruits.prototype = { color: “red”, say: function()
{ console.log(“My color is ” + this.color); } } var apple = new fruits;
apple.say(); //My color is red

1
2
3
4
5
6
7
8
9
10
11
function fruits() {}
 
fruits.prototype = {
    color: "red",
    say: function() {
        console.log("My color is " + this.color);
    }
}
 
var apple = new fruits;
apple.say();    //My color is red

然则只要我们有叁个对象banana= {color : “yellow”} ,我们不想对它再也定义
say 方法,那么大家可以透过 call 或 apply 用 apple 的 say 方法:

JavaScript

banana = { color: “yellow” } apple.say.call(banana); //My color is
yellow apple.say.apply(banana); //My color is yellow

1
2
3
4
5
banana = {
    color: "yellow"
}
apple.say.call(banana);     //My color is yellow
apple.say.apply(banana);    //My color is yellow

据此,能够看看 call 和 apply 是为着动态改动 this 而出现的,当一个 object
未有有个别方法(本栗子中banana未有say方法),可是别的的有(本栗子中apple有say方法),大家得以依赖call或apply用其余对象的方法来操作。

apply、call 的区别

对于 apply、call
二者来讲,功能完全一致,只是接受参数的秘诀不太一样。举例,有贰个函数定义如下:

JavaScript

var func = function(arg1, arg2) { };

1
2
3
var func = function(arg1, arg2) {
 
};

就足以经过如下格局来调用:

JavaScript

func.call(this, arg1, arg2); func.apply(this, [arg1, arg2])

1
2
func.call(this, arg1, arg2);
func.apply(this, [arg1, arg2])

其间 this 是您想钦点的上下文,他能够是别的三个 JavaScript
对象(JavaScript 中全方位皆对象),call 须要把参数按顺序传递步向,而 apply
则是把参数放在数组里。

JavaScript
中,某些函数的参数数量是不固定的,由此要说适用条件的话,当你的参数是闻名海外知晓数据时用
call 。

而不明确的时候用 apply,然后把参数 push
进数组传递步向。当参数数量不确定期,函数内部也足以经过 arguments
那一个数组来遍历全部的参数。

为了加固深化记念,下边罗列部分常用用法:

1、数组之间追加

JavaScript

var array1 = [12 , “foo” , {name “Joe”} , -2458]; var array2 = [“Doe”
, 555 , 100]; Array.prototype.push.apply(array1, array2); /* array1
值为 [12 , “foo” , {name “Joe”} , -2458 , “Doe” , 555 , 100] */

1
2
3
4
var array1 = [12 , "foo" , {name "Joe"} , -2458];
var array2 = ["Doe" , 555 , 100];
Array.prototype.push.apply(array1, array2);
/* array1 值为  [12 , "foo" , {name "Joe"} , -2458 , "Doe" , 555 , 100] */

2、获取数组中的最大值和最小值

JavaScript

var numbers = [5, 458 , 120 , -215 ]; var maxInNumbers =
Math.max.apply(Math, numbers), //458 maxInNumbers =
Math.max.call(Math,5, 458 , 120 , -215); //458

1
2
3
var  numbers = [5, 458 , 120 , -215 ];
var maxInNumbers = Math.max.apply(Math, numbers),   //458
    maxInNumbers = Math.max.call(Math,5, 458 , 120 , -215); //458

number 自个儿并未有 max 方法,不过 Math 有,大家就能够借助 call 或许 apply
使用其艺术。

3、验证是还是不是是数组(前提是toString()方法未有被重写过)

JavaScript

functionisArray(obj){ returnObject.prototype.toString.call(obj) ===
‘[object Array]’ ; }

1
2
3
functionisArray(obj){
    returnObject.prototype.toString.call(obj) === ‘[object Array]’ ;
}

4、类(伪)数组使用数组方法

JavaScript

var domNodes =
Array.prototype.slice.call(document.getElementsByTagName(“*”));

1
var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*"));

Javascript中设有一种名称为伪数组的对象协会。相比非常的是 arguments
对象,还也许有像调用 getElementsByTagName , document.childNodes 之类的,它们再次回到NodeList对象都属于伪数组。无法选取Array下的 push , pop 等方式。

只是大家能经过 Array.prototype.slice.call 调换为确实的数组的含有 length
属性的靶子,那样 domNodes 就足以采用 Array 下的具备办法了。

深远精通运用apply、call

下面就借用一道面课题,来更加深入的去领略下
apply 和 call 。

概念三个 log 方法,让它能够代办 console.log 方法,常见的缓慢解决格局是:

JavaScript

function log(msg) { console.log(msg); } log(1); //1 log(1,2); //1

1
2
3
4
5
function log(msg) {
  console.log(msg);
}
log(1);    //1
log(1,2);    //1

地点方法能够消除最主题的供给,不过当传入参数的个数是不明确的时候,上边的主意就失效了,那一年就能够设想动用
apply 大概call,注意这里传出几个参数是不明确的,所以利用apply是最棒的,方法如下:

JavaScript

function log(){ console.log.apply(console, arguments); }; log(1); //1
log(1,2); //1 2

1
2
3
4
5
function log(){
  console.log.apply(console, arguments);
};
log(1);    //1
log(1,2);    //1 2

接下去的需求是给每二个 log 音信加多三个”(app)”的前辍,比方:

JavaScript

log(“hello world”); //(app)hello world

1
log("hello world");    //(app)hello world

该咋做相比较优雅呢?这一年必要想到arguments参数是个伪数组,通过
Array.prototype.slice.call
转化为正规数组,再利用数组方法unshift,像这么:

JavaScript

function log(){ var args = Array.prototype.slice.call(arguments);
args.unshift(‘(app)’); console.log.apply(console, args); };

1
2
3
4
5
6
function log(){
  var args = Array.prototype.slice.call(arguments);
  args.unshift(‘(app)’);
 
  console.log.apply(console, args);
};

bind

说完了 apply 和 call ,再来讲说bind。bind() 方法与 apply 和 call
很相似,也是足以退换函数体内 this 的针对。

MDN的解释是:bind()方法会创设三个新函数,称为绑定函数,当调用这么些绑定函数时,绑定函数会以创造它时传出 bind()方法的首先个参数作为 this,传入 bind() 方法的第4个以及未来的参数加上绑定函数运维时自身的参数遵照顺序作为原函数的参数来调用原函数。

平昔来看看具体如何利用,在大规模的单人体模型式中,平常大家会选取 _this , that
, self 等保存 this
,那样大家能够在改造了上下文之后持续援引到它。 像那样:

JavaScript

var foo = { bar : 1, eventBind: function(){ var _this = this;
$(‘.someClass’).on(‘click’,function(event) { /* Act on the event */
console.log(_this.bar); //1 }); } }

1
2
3
4
5
6
7
8
9
10
var foo = {
    bar : 1,
    eventBind: function(){
        var _this = this;
        $(‘.someClass’).on(‘click’,function(event) {
            /* Act on the event */
            console.log(_this.bar);     //1
        });
    }
}

出于 Javascript 特有的编写制定,上下文处境在 eventBind:function(){ }
过渡到 $(‘.someClass’).on(‘click’,function(event)
{ }) 发生了退换,上述使用变量保存 this 那么些措施都以行得通的,也从没怎么难点。当然使用
bind() 能够进一步雅致的缓慢解决那些难点:

JavaScript

var foo = { bar : 1, eventBind: function(){
$(‘.someClass’).on(‘click’,function(event) { /* Act on the event */
console.log(this.bar); //1 }.bind(this)); } }

1
2
3
4
5
6
7
8
9
var foo = {
    bar : 1,
    eventBind: function(){
        $(‘.someClass’).on(‘click’,function(event) {
            /* Act on the event */
            console.log(this.bar);      //1
        }.bind(this));
    }
}

在上述代码里,bind()
成立了四个函数,当那些click事件绑定在被调用的时候,它的 this
关键词会被设置成被传到的值(这里指调用bind()时传出的参数)。由此,这里大家传入想要的内外文
this(其实就是 foo ),到 bind() 函数中。然后,当回调函数被实施的时候,
this 便指向 foo 对象。再来一个不难的栗子:

JavaScript

var bar = function(){ console.log(this.x); } bar(); // undefined var
func = bar.bind(foo); func(); // 3

1
2
3
4
5
6
7
var bar = function(){
    console.log(this.x);
}
 
bar(); // undefined
var func = bar.bind(foo);
func(); // 3

此地我们创立了二个新的函数 func,当使用 bind()
成立二个绑定函数之后,它被实践的时候,它的 this 会被设置成 foo ,
并不是像大家调用 bar() 时的大局功用域。

有个风趣的标题,假诺老是 bind() 两遍,亦也许是连接 bind()
叁遍那么输出的值是如何吧?像那样:

JavaScript

var bar = function(){ console.log(this.x); } var foo = { x:3 } var sed =
{ x:4 } var func = bar.bind(foo).bind(sed); func(); //? var fiv = { x:5
} var func = bar.bind(foo).bind(sed).bind(fiv); func(); //?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var bar = function(){
    console.log(this.x);
}
var foo = {
    x:3
}
var sed = {
    x:4
}
var func = bar.bind(foo).bind(sed);
func(); //?
 
var fiv = {
    x:5
}
var func = bar.bind(foo).bind(sed).bind(fiv);
func(); //?

答案是,三回都仍将出口 3 ,而非期待中的 4 和 5
。原因是,在Javascript中,多次 bind() 是没用的。更加深档案的次序的来头, bind()
的落到实处,也便是采纳函数在里头包了三个 call / apply ,第2回 bind()
约等于再包住第一遍 bind() ,故第一遍以后的 bind 是不能够生效的。

apply、call、bind比较

那么 apply、call、bind 三者相相比,之间又有怎么样异同呢?什么时候使用
apply、call,哪天使用 bind 呢。轻便的叁个尖栗:

JavaScript

var obj = { x: 81, }; var foo = { getX: function() { return this.x; } }
console.log(foo.getX.bind(obj)()); //81 console.log(foo.getX.call(obj));
//81 console.log(foo.getX.apply(obj)); //81

1
2
3
4
5
6
7
8
9
10
11
12
13
var obj = {
    x: 81,
};
 
var foo = {
    getX: function() {
        return this.x;
    }
}
 
console.log(foo.getX.bind(obj)());  //81
console.log(foo.getX.call(obj));    //81
console.log(foo.getX.apply(obj));   //81

多少个出口的都是81,不过注意看使用 bind() 方法的,他前边多了对括号。

也正是说,差别是,当你指望改换上下文境况之后不要立刻实践,而是回调试行的时候,使用
bind() 方法。而 apply/call 则会及时实行函数。

再计算一下:

  • apply 、 call 、bind 三者都以用来更动函数的this对象的指向的;
  • apply 、 call 、bind
    三者第一个参数都以this要指向的对象,也正是想钦命的上下文;
  • apply 、 call 、bind 三者都能够选用三番五次参数字传送参;
  • bind 是回来对应函数,便于稍后调用;apply 、call 则是当时调用 。

正文实例出现的保有代码,在本身的github上可以下载。

打赏援救本身写出愈来愈多好小说,多谢!

打赏我

H5单页面手势滑屏切换原理

2016/03/22 · HTML5 · 2
评论 ·
滑屏

初稿出处: 一像素   

H5单页面手势滑屏切换是运用HTML5 触摸事件(Touch) 和
CSS3动画(Transform,Transition)来实现的,效果图如下所示,本文轻便说一下其落到实处原理和要害思路。

图片 4

1、实现原理

要是有5个页面,各样页面占荧屏百分百宽,则成立二个DIV容器viewport,将其调幅(width)
设置为500%,然后将5个页面装入容器中,并让那5个页面平分整个容器,最终将容器的暗中认可位置设置为0,overflow设置为hidden,那样显示器就私下认可突显首个页面。

<div id=”viewport” class=”viewport”> <div class=”pageview”
style=”background: #3b76c0″ > <h3 >页面-1</h3>
</div> <div class=”pageview” style=”background: #58c03b;”>
<h3>页面-2</h3> </div> <div class=”pageview”
style=”background: #c03b25;”> <h3>页面-3</h3>
</div> <div class=”pageview” style=”background: #e0a718;”>
<h3>页面-4</h3> </div> <div class=”pageview”
style=”background: #c03eac;”> <h3>页面-5</h3>
</div> </div>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<div id="viewport" class="viewport">
    <div class="pageview" style="background: #3b76c0" >
        <h3 >页面-1</h3>
    </div>
    <div class="pageview" style="background: #58c03b;">
        <h3>页面-2</h3>
    </div>
    <div class="pageview" style="background: #c03b25;">
        <h3>页面-3</h3>
    </div>
    <div class="pageview" style="background: #e0a718;">
        <h3>页面-4</h3>
    </div>
    <div class="pageview" style="background: #c03eac;">
        <h3>页面-5</h3>
    </div>
</div>

CSS样式:

.viewport{ width: 500%; height: 100%; display: -webkit-box; overflow:
hidden; pointer-events: none; -webkit-transform: translate3d(0,0,0);
backface-visibility: hidden; position: relative; }

1
2
3
4
5
6
7
8
9
10
.viewport{
   width: 500%;
   height: 100%;
   display: -webkit-box;
   overflow: hidden;
   pointer-events: none;
   -webkit-transform: translate3d(0,0,0);
   backface-visibility: hidden;
   position: relative;
}

挂号touchstart,touchmove和touchend事件,当手指在显示器上海搞笑剧团动时,使用CSS3的transform来实时设置viewport的职位,举例要展现第一个页面,就设置viewport的transform:translate3d(100%,0,0)
即可,
在这里大家使用translate3d来代表translateX,translate3d能够主动敞开手提式有线电话机GPU加快渲染,页面滑动更通畅。

2、主要思路

从手指放在显示屏上、滑动操作、再到离开显示屏是一个一体化的操作进度,对应的操作会触发如下事件:

手指放在荧屏上:ontouchstart

手指在显示器上海好笑剧团动:ontouchmove

手指离开显示屏:ontouchend

大家须求捕获触摸事件的那八个阶段来完结页面包车型大巴滑行:

ontouchstart: 开头化变量, 记录手指所在的岗位,记录当前时刻

/*手指放在显示屏上*/ document.addEventListener(“touchstart”,function(e){
e.preventDefault(); var touch = e.touches[0]; startX = touch.pageX;
startY = touch.pageY; initialPos = currentPosition;
//这一次滑动前的初叶地点 viewport.style.webkitTransition = “”;
//撤废动画效用 startT = new Date().getTime(); //记录手指按下的开端时间
isMove = false; //是还是不是爆发滑动 }.bind(this),false);

1
2
3
4
5
6
7
8
9
10
11
/*手指放在屏幕上*/
document.addEventListener("touchstart",function(e){
   e.preventDefault();
   var touch = e.touches[0];
   startX = touch.pageX;
   startY = touch.pageY;
   initialPos = currentPosition;   //本次滑动前的初始位置
   viewport.style.webkitTransition = ""; //取消动画效果
   startT = new Date().getTime(); //记录手指按下的开始时间
   isMove = false; //是否产生滑动
}.bind(this),false);

ontouchmove:
获得当前所在地点,计算手指在显示器上的移位差量deltaX,然后使页面跟随移动

/*手指在显示屏上海滑稽剧团动,页面跟随手指运动*/
document.addEventListener(“touchmove”,function(e){ e.preventDefault();
var touch = e.touches[0]; var deltaX = touch.pageX – startX; var
deltaY = touch.pageY – startY;
//假如X方向上的位移大于Y方向,则认为是反正滑动 if (Math.abs(deltaX) >
Math.abs(deltaY)){ moveLength = deltaX; var translate = initialPos +
deltaX; //当前急需活动到的岗位 //要是translate>0 或 if (translate =
maxWidth){ //移动页面 this.transform.call(viewport,translate); isMove =
true; } direction = deltaX>0?”right”:”left”; //推断手指滑动的主旋律 }
}.bind(this),false);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
/*手指在屏幕上滑动,页面跟随手指移动*/
document.addEventListener("touchmove",function(e){
   e.preventDefault();
   var touch = e.touches[0];
   var deltaX = touch.pageX – startX;
   var deltaY = touch.pageY – startY;
   //如果X方向上的位移大于Y方向,则认为是左右滑动
   if (Math.abs(deltaX) > Math.abs(deltaY)){
       moveLength = deltaX;
       var translate = initialPos + deltaX; //当前需要移动到的位置
       //如果translate>0 或
       if (translate = maxWidth){
           //移动页面
           this.transform.call(viewport,translate);
           isMove = true;
       }
       direction = deltaX>0?"right":"left"; //判断手指滑动的方向
   }
}.bind(this),false);

ontouchend:手指离开荧屏时,计算显示器最后停留在哪一页。首先总计手指在显示屏上的停留时间deltaT,要是deltaT

(1)假设是便捷滑动,则让日前页面完整的滞留在显示器中心(必要总括当前页面还可能有稍稍必要滑动)

(2)假诺是慢速度滑冰动,还索要看清手指在显示器上海好笑剧团动的偏离,假如滑动的相距未有超过荧屏宽度八分之四,则要回落到上一页,相反则要停留在此时此刻页面

/*手指离开荧屏时,总括最后供给逗留在哪一页*/
document.add伊夫ntListener(“touchend”,function(e){ e.preventDefault();
var translate = 0; //计算手指在显示屏上驻留的岁月 var deltaT = new
Date().getTime() – startT; if (isMove){ //产生了左右滑动
//使用动画片过渡让页面滑动到结尾的地点 viewport.style.webkitTransition =
“0.3s ease -webkit-transform”; if(deltaT
//借使停留时间小于300ms,则以为是便捷滑动,无论滑动距离是稍稍,都停留到下一页
translate = direction == ‘left’?
currentPosition-(pageWidth+moveLength):currentPosition+pageWidth-moveLength;
//假使最后地方超越界限地方,则停留在边界地点 translate = translate >
0 ? 0 : translate; //左侧界 translate = translate //左边界 }else {
//假诺滑动距离小于显示器的百分之五十,则退回到上一页 if
(Math.abs(moveLength)/pageWidth moveLength; }else{
//假若滑动距离当先显示器的八分之四,则滑动到下一页 translate = direction ==
‘left’?
currentPosition-(pageWidth+moveLength):currentPosition+pageWidth-moveLength;
translate = translate > 0 ? 0 : translate; translate = translate
maxWidth : translate; } } //实践滑动,让页面完整的显获得显示器上
this.transform.call(viewport,translate); } }.bind(this),false);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
/*手指离开屏幕时,计算最终需要停留在哪一页*/
document.addEventListener("touchend",function(e){
   e.preventDefault();
   var translate = 0;
   //计算手指在屏幕上停留的时间
   var deltaT = new Date().getTime() – startT;
   if (isMove){ //发生了左右滑动
        //使用动画过渡让页面滑动到最终的位置
        viewport.style.webkitTransition = "0.3s ease -webkit-transform";
        if(deltaT //如果停留时间小于300ms,则认为是快速滑动,无论滑动距离是多少,都停留到下一页
            translate = direction == ‘left’?
            currentPosition-(pageWidth+moveLength):currentPosition+pageWidth-moveLength;
            //如果最终位置超过边界位置,则停留在边界位置
            translate = translate > 0 ? 0 : translate; //左边界
            translate = translate //右边界
        }else {
            //如果滑动距离小于屏幕的50%,则退回到上一页
            if (Math.abs(moveLength)/pageWidth moveLength;
            }else{
                //如果滑动距离大于屏幕的50%,则滑动到下一页
                translate = direction == ‘left’?
                currentPosition-(pageWidth+moveLength):currentPosition+pageWidth-moveLength;
                translate = translate > 0 ? 0 : translate;
                translate = translate  maxWidth : translate;
            }
        }
        //执行滑动,让页面完整的显示到屏幕上
        this.transform.call(viewport,translate);
    }
}.bind(this),false);

而外,还要计算当前页面是第几页,并安装当前页码

//总结当前的页码 pageNow = Math.round(Math.abs(translate) / pageWidth) +
1; setTimeout(function(){
//设置页码,DOM操作须求安置子线程中,不然会见世卡顿 this.setPageNow();
}.bind(this),100);

1
2
3
4
5
6
7
//计算当前的页码
pageNow = Math.round(Math.abs(translate) / pageWidth) + 1;
 
setTimeout(function(){
    //设置页码,DOM操作需要放到子线程中,否则会出现卡顿
    this.setPageNow();
}.bind(this),100);

基本的思绪就那些,当然在实操进度中还只怕有局地细节须要小心,这里就不详细说了,都在代码里能展现出来,源代码已传至Git:https://github.com/git-onepixel/guesture,
风野趣的同桌应接一齐座谈,(由于时间原因,本示例未有投入history路由),你也足以点击或扫描下边二维码来查看示例效果:

图片 5

 

3 赞 24 收藏 2
评论

图片 3

发表评论

电子邮件地址不会被公开。 必填项已用*标注