vux 更改 Tabbar 选中状态

在 vux 的文档和示例中,都没有明确的说明 tabbar 上 v-model 的使用

文档中将v-model说明放在了 TabbarItem 示例下,但是其实这个应该是放在Tabbar

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<template>
<router-view class="view" v-on:changeTab="changeTab"></router-view>
<tabbar v-model="index">
<tabbar-item></tabbar-item>
...
<tabbar-item></tabbar-item>
</tabbar>
</template>
<script>
data(){
return{
index:0,
...
}
}
methods:{
changeTab(num){
...
this.index = num;
...
}
}
</scirpt>

然后子组件中调用

1
2
3
mounted(){
this.$emit('changeTab', 2)
}

这样就便于在不同的组件内都可以更改 Tabbar 选中状态

关于设备转向后的自适应

关于移动端的适配,都知道其实 rem 是比较好的一个适配方案,但是 rem 是根据根目录的字体大小来调解的,那么,我们在做网页的时候,屏幕旋转后,能否让根目录的字体跟着变化呢?

先上代码:

1
2
3
4
$(function(){
var size = $(window).width() / 25;
$('html').css('font-size': size);
});

这样在 css 中用 rem 单位是没什么问题,但是如果屏幕旋转之后,你就会发现,真的不能看了就。原因就是屏幕旋转以后,根上的字体并没有随之变化。

所以我们来加上

1
2
3
4
5
6
7
8
9
10
11
12
13
// 监视设备方向
window.addEventListener("orientationchange", function() {
media();
}, false);

function media(argument) {
// 因为获取尺寸出错,需要延迟获取
setTimeout(function(){
var size = $(window).width() / 25;
console.log('the device size: '+size);
$('html').css('font-size', size);
}, 200);
}

VH 情怀黄铜原子笔

「知乎专栏地址」

收到 @罗文森 赠送的笔已经很多天了,快两个星期了吧。

一直在找时间想写一篇评测出来,终究是没抽出时间,况且,我不是写手!眼看时间一天天过去,心里也越来越愧疚。

其实最主要的也不单单是写不出什么,而是总归要用它画两幅画出来,才会感觉的出来到底合不合心意。

阅读更多

SOLOVE Air-M20000

第一次为产品写评测吧我这是,也不太记得了。不过以下这个电源,觉得值得写上一篇。

阅读更多

自定义文件上传框

其实这根本就不值得写出来,只是可能前几步大家都做了,只是最后一步就忽略了。 我们在自定义input:file的时候,一般来说都是外边包一层,里边在写一个<input type="file">, 然后将其透明值设置成0,然后再定义外层的样式来达到自定义的目的。

阅读更多

VSCO FILM 00 FREE STARTER PACK

本文知乎专栏

VSCOCam 是 iOS 上一款滤镜相机,其最著名的地方就是他们的胶片滤镜。 而其实 VSCO 在这款 APP 之前,就一直在做胶片滤镜,有 OS X 和 WIN 两个平台的版本。最主要的是作为 LightRoom 的插件存在。

阅读更多

在 Yosemite 中设置 Pow

在 Yosemite 中,Pow 安装和启动是有问题的。这是因为 ipfw 被移除了,所以如果要在 Yosemite 中跑 Pow,需要做些设置才可以。

阅读更多