rand

{{ arr | rand }}

{{ arr | rand(3) }}

<div id="app">
  <p>{{ arr | rand }}</p>
  <p>{{ arr | rand(3) }}</p>
</div>
new Vue({
  el: '#app',
  data: {
    arr: ['A', 'B', 'C', 'D']
  },
  filters: {
    rand(arr, n) {
      if (arr.length < n) {
        throw new Error('Vue.js filter randの引数が多すぎます')
        return
      } else if (n > 1) {
        let result = []
        let index
        while(result.length < n) {
          index = Math.floor(Math.random() * arr.length)
          if (~result.indexOf(arr[index])) continue
          result.push(arr[index])
        }
        return result
      } else {
        return arr[Math.floor(Math.random() * arr.length)]
      }
    }
  }
})