javascript - vue js vue-slider-component 如何更新 Prop

Question

我是 vue js 新手，缺少传递组件 prop。
尝试制作 vue-slider-component example是垂直的。

<vue-slider direction=vertical ></vue-slider> 

和

<vue-slider :direction=vertical ></vue-slider>

失败了，我应该如何将 props 传递给示例中的组件？

编辑:
尝试了评论中的建议:

<vue-slider direction={vertical} ></vue-slider> 

和

<vue-slider :direction={vertical} ></vue-slider>

Answer 1

您应该像这样将值作为字符串传递:

<vue-slider :direction="'vertical'"></vue-slider>

查看示例 here

new Vue( {
  el: '#app',
  data () {
    return {
    }
  },

  methods: {
  },
  mounted () {
  },
  components: {
    'vueSlider': window[ 'vue-slider-component' ],
  }
})

#app {
  margin: 50px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.min.js"></script>
<script src="https://nightcatsama.github.io/vue-slider-component/dist/index.js"></script>
<div id="app">
  <vue-slider :direction="'vertical'" :height="100" :width="6"></vue-slider>
</div>