@axhello 更新了上面回文，可以看一下，按你說的做了個小demo
https://jsfiddle.net/fkdz3keu/1/
(剛網址貼錯了)
是這樣嗎？

不太理解想要的效果，不過如果是想要只取部分的話，vue有個內建的filter可以實現
https://vuejs.org/api/#limitBy

如果是想要取文字摘要的話，可以自己寫個很簡單的filter處理
https://jsfiddle.net/a62q9zc4/1/

Vue.filter('except', function (value, number) {
  return value.slice(0, -(value.length - number)) + '...'
})

Laravist是用Bootstrap，但是裡面並沒有這個樣式的組件，自定義一下CSS就可以有這效果了
https://jsfiddle.net/ytkpgcps/1/

@JellyBool
是阿 XD

@itjb
confirmed這個rule會根據其欄位名稱去匹配相對應的confirmation

[
            'name' => 'required|min:3',
            'email' => 'required|email',
            'password' => 'required|min:6|confirmed',
            'password_confirmation' => 'required|min:6' 
 ]

當然你表單裡的input name也要改成password_confirmation

@itjb
confirmed這個rule應該是要用password_confirmation才對...

@lyon
不敢當ＸＤ，剛好最近用vue開發，碰到類似情況

是這樣沒錯，之前是一陣子都在學javascript，一直覺得php的closure很怪ＸＤ

還有一點是closure中的$this在php5.3版本是不支援的，會出錯，5.4以後才支援，至於$this是不是都表示object本身還是有一些奇特方法會造成其context改變，例如：

<?php

class A {
    public $value = "A";

    function getClosure() {
        return function() {
            echo $this->value, "\n";
        };
    }
}

class B {
    public $value = "B";
}

$a = new A();
$b = new B();

call_user_func($a->getClosure());  // 顯示 A
call_user_func($a->getClosure()->bindTo($b, $b)); // 顯示 B

bindTo會改變closure的context

喔喔喔～，問題沒看清楚，Request在驗證失敗後，會根據請求方式來回應
所以當CreateProductsRequest驗證失敗後，會回傳一個422的response，可以在$.ajax裡的error接收到
response內容大致上是

{
    '錯誤欄位名稱': [
        0: '驗證失敗的rule訊息'
    ]
}

一個欄位會有多個驗證，所以欄位底下的錯誤訊息是array，再根據欄位名稱來插入錯誤訊息，這部分就必須自己實現了，可以用$(selector).append()

這是我常用格式，success其實也可以省略掉，status code本身就有失敗或成功的意義。

return response()->json([
 'success' => false,
 'message' => '失敗惹...',
], 422);

@sodasix

突然發現自己不小心打錯惹

應該是

// 回傳匹配item的index
this.items.findIndex(item => item.id === id)

才對

findIndex和find都是ES6才有的特性，如果是ES6之前版本可以用filter