2017-02-18 15 views
1

私はVueJSで働いていると私は、次のコードVueJsコンポーネント名

<li @click = "selectedComponent = 'appManagment'"><i class="ion-clipboard"></i>Management</li> 

ので、私は何を達成しようとすると、{{selectedComponent}}

のような名前を表示することですが、それは「appManagment」が表示さexcpectedとを持っていますこれが選択されたコンポーネントであるためです。 問題は、別の名前を表示する方法です。たとえば、「appManagment」ではなく「Managment」だけを表示したいとします。 私は、ユーザーがいる場所を表示するナビゲーションメニューに使用しているので、どんな助けにも感謝します。

+1

限り:フィルタ機能は、引数として値をとり、変換した値を返します。

Vue.filter('custom', function (value) { // add your code to determine // name based on value here return newName; }) 

を次に、テキストにあなたのフィルタを使用しますあなたの問題を理解してください – mic4ael

+0

"selectedComponents"に別の名前を表示させることは可能ですか?そのappManagmentを表示するように - >私は必要な右のコンポーネントですが、私はちょうどこれを達成するために(私のナビゲーションで)表示するために、より美しい名前が欲しいですか? – Stan

答えて

1

私は

var prettyNames = { 
    'appManagment': 'Some very nice name' 
} 

以下のいずれかのようオブジェクトを作成し、現在選択されているコンポーネントに対応するテキストを表示したい時はいつでも、次にそれを使用します。例えば、

+0

ありがとう、私はそれが非常に基本的な解決策であることを知っていた:) – Stan

0

グローバルVue.filter()メソッドでカスタムフィルタを登録し、filterIDとフィルタ関数を渡すことができます。 「私はあなたが私はドン考える手助けしたいと

<i class="ion-clipboard"></i>{{ selectedComponent | custom }} 
関連する問題