Vueのdevtools chrome拡張機能で自分のアプリケーションの状態を見ると、同じコンポーネントの複数のインスタンスがツリービューに表示されます。しかし、あるインスタンスと別のインスタンスを区別する方法はありません。たとえば、下のスクリーンショットには、3つの<Todo>コンポーネントがあります。代わりに30があると想像してみてください。コンポーネントに何らかの種類のインスタンス名やIDを付けるにはどうすればいいですか？私が必要とするものを見つけるために30のコンポーネントをクリックしなければならないのはばかげているようです。 
Vue Devtoolsのコンポーネントインスタンスを区別する方法
私も数ヶ月前に同じ考えがありました。
私は試してみました。
私のPRが送信されました：https://github.com/vuejs/vue-devtools/pull/331
コアチームは依然としてPRを拒否するか、他の命名規則を要求することができるので、それは私の解決策に頼ることはおそらく少し早いのです。
それまでは、あなたが私のレポから私の提案バージョンを自分で構築することができます： https://github.com/nerdyglasses/vue-devtools/tree/verbose-component-tree
はあなたを助けていることですか？ない方法は、現時点では存在しない場合、おそらく、彼らはそれを追加しますGitHubのレポhttps://github.com/vuejs/vue-devtools/issues上の問題を開くために有用であろうクリスチャン
、
ベスト将来は。 –
どうやってこの作品のようなものを好きですか？コンポーネント 'name'のハッシュマップは' prop'の横に表示されますか？ 'Vue.config.devtoolsComponentIdentifierMap = {Todo： 'id'}'次に、 ' || ||インスペクタの ''？ –
良い解決策であるかどうかは分かりませんが、コンポーネントの 'mounted'メソッドの' $ this.name = 'todo' + this.todo.someProp'を実行することができます –