Question

我有以下情况：

card.beforeChanged

需要通过组合两个字符串来设置字幕。 card.changed包含“last changed to：”字符串，formatDate()变量包含datetimestring。通过de $ErrorActionPreference = "Stop"; while($true) { try { Write-Host "Step 1"; Dir C:\arts #Error Write-Host "Step 2"; exit 0 break; } catch { "Error in " + $_.InvocationInfo.ScriptName + " at line: " + $_.InvocationInfo.ScriptLineNumber + ", offset: " + $_.InvocationInfo.OffsetInLine + "."; $Error exit 1 break; } }，datetimestring被格式化为可读日期。

字幕现在返回：“上次更改为：2069882880”。

问题：是否可以组合两个字符串，其中一个字符串通过filter属性一次性格式化？

Answer 1

你应该使用computer property。

＆＃13;

Vue.filter('formatDate', function (value) {
    return moment(value).fromNow()
})

Vue.component('todo', {
 		computed: {
    	formatedText: function () {
      	return `${this.text} - ${Vue.filter('formatDate')(this.date)}`
    	}
  	},
 		props: ['text', 'date'],
    template: '<li>{{ formatedText }}</li>'
});

var demo = new Vue({
    el: '#demo',
    data: {
      todos: [
        {text:'testing', date: new Date()},
        {text:'old text', date: moment().subtract(7, 'days')}
      ]
    }
})

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.6/vue.min.js"></script>
<div id="demo" v-cloak>
    <p v-if="!todos.length">No todos at this moment.</p>
    <ul v-else>
        <todo v-for="t in todos" :text=t.text :date=t.date></todo>
    </ul>
</div>

＆＃13;

Answer 2

让它通过一种方法。计算属性不是一个选项，因为datestring来自模板中的for循环。

方法：

formatDate: (date, format) => {
  if (!date) return ''
  if (!format) format = 'DD.MM.YYYY'
  return moment(date).format(format)
}

实现：

<bl-column v-for="(card, index) in cards" :key="card.id">
     <bl-card :index="index" type="section" action="drawer" :title="card.titleShort" :subtitle="(card.beforeChanged || '') + ' ' + formatDate(card.changed)" />
</bl-column>

结合双值+滤波器的动态变量

2 个答案: