truncate

{{ str | truncate(5) }}

{{ str | truncate(5, '〜') }}

<div id="app">
  <p><input v-model="str"></p>
  <p>{{ str | truncate(5) }}</p>
  <p>{{ str | truncate(5, '〜') }}</p>
</div>
new Vue({
  el: '#app',
  data: {
    str: '1234567890'
  },
  filters: {
    truncate(value, n, o) {
      let len = +n
      let suffix = o ? o.toString() : '...'
      if (value.length <= len) return value
      return value.substring(0, len) + suffix
    }
  }
})