Vueコンポーネントはバインディングスタイルではありません

Question

こんにちは、私はVueで初めてです。 私は私がデータにプロパティを追加するように、トップの位置を設定するコンポーネントSliderItemを持っている：

data() { 
    return { 
    /*more data*/ 
    topSliderText: '120px' 
    } 
} 

これは

import { Slider } from 'vue-easy-slider' 
var SliderItem = require('./components/easy-slider-item.vue'); 

new Vue({ 
    el: '#slider', 
    data() { 
    return { 
     list: [ 
     { background: "url('/images/sliders/be.png')", width: '100%', height: '100%' }, 
     ] 
    } 
    }, 
    components: { 
    Slider, 
    SliderItem 
    }, 
    mounted() { 

    } 
}); 

、その後、ビューの

<div class="" id="slider"> 
<slider animation="fade"> 
    <slider-item v-bind:style="{top: topSliderText}" v-for="(i, index) in list" :key="index"> 
    <div :style="i"> 
     <div class="slider-text"> 
      <p style="font-size: 5rem; text-align: center;">Page @{{ index +1 }}</p> 
     </div> 

    </div> 
    </slider-item> 
</slider> 

Vueのインスタンスであります

しかし、動作していない、SliderItemは何のスタイルを持っていない、と私はこれがコンソール

VUE-slider.jsに警告し得る：561 [Vueが警告]：プロパティまたはメソッド「topSliderTextは」インスタンスで定義されたが、レンダリング時に参照されていません。データオプションで無効なデータプロパティを宣言してください。

VUE-slider.js：562 [ヴューが警告]：計算プロパティを「topSliderText」既にデータ

で定義されたしかし、私はコンポーネントを参照するためにVueのクロム拡張機能を使用する場合、それはそう性を有しています...私は何が間違っているのか分かりません...

ありがとうございます。

Answer 1

topSliderTextをSliderItemのコンポーネントに定義しましたが、それを親コンポーネントで使用しました。

これは、親コンポーネントのプロパティでtopSliderTextのvue検索としてvue [warn]を取得する理由です。

だから、親コンポーネント自体