vue.js 过滤器传参数及接收
看官方的代码,过滤器中是可以传多个参数的。我的初始代码如下:html代码:……<div class="order-view-box"><div class="order-progress"><ol class="progress-list clearfix">
·
看官方的代码,过滤器中是可以传多个参数的。
我的初始代码如下:
html代码:
……
<div class="order-view-box">
<div class="order-progress">
<ol class="progress-list clearfix">
<li class="step step-done step-first">
<div class="progress"><span class="text">创建</span></div>
<div class="info">{{taskitem.createDate | FormatDate( taskitem.createDate ,'MM月DD日 HH:mm' )}}</div>
</li>
<li class="step step-active">
<div class="progress"><span class="text">出发</span></div>
<div class="info">01月20日 11:00</div>
</li>
<li class="step">
<div class="progress"><span class="text">到达</span></div>
<div class="info"></div>
</li>
<li class="step">
<div class="progress"><span class="text">记录</span></div>
<div class="info"></div>
</li>
<li class="step step-last">
<div class="progress"><span class="text">完成</span></div>
<div class="info"></div>
</li>
</ol>
</div>
</div>
.
省略
.
.
<script src="../../js/date_fns.min.js" type="text/javascript" charset="utf-8"></script> <!--日期格式化插件-->
<script src="../../js/vue_test.js" type="text/javascript" charset="utf-8"></script>
vue_test.js代码:
var vm = new Vue({
el: '.mui-content',
data: {
taskitem: {},
weatherDict: []
},
mounted: function(){
this.$nextTick(function() {
……
});
},
filters:{
FormatDate:function(date,type){
console.log(date+","+type);
return dateFns.format(date,type);
}
},
methods: {
……
}
})
此时,接收到的参数总是只有时间,控制台打印:2017-04-03 23:21:30,2017-04-03 23:21:30
修改html代码如下后
<div class="info">{{taskitem.createDate | FormatDate( 'MM月DD日 HH:mm' ,taskitem.createDate )}}</div>
控制台打印为2017-04-03 23:21:30,MM月DD日 HH:mm
由此可见,过滤器传参是有顺序的,这个坑得注意!
更多推荐
已为社区贡献1条内容
所有评论(0)