首页 文章

使用Vueify渲染函数时，在模板中绑定Vue数据属性值

提问于
浏览 次
1

我是Vue的新手，我的问题是 data 属性中的值绑定到我的Vueify模板中的占位符 . 我确信这是一个简单的缺乏理解，但任何帮助将不胜感激 .

我正在使用Browserify在我的.vue文件上运行Vueify转换 .

这是我目前的设置：

new Vue({
        el: '#clip-slides',
        render : function(createElement){
            var template = require('./clips.vue');
            return createElement(template);
        },
        data : {
            'testValue' : 'I am a test value!'
        }
    });

<template>
    <div>
        {{testValue}}
    </div>
</template>

模板中的占位符 testValue 将替换为空字符串 .

如何正确地为模板提供“数据”选项，我需要做什么？

javascript vue.js vuejs2 browserify

1 回答

  • 2

    将其作为 property 传递 .

    Clips.vue

    <template>
    <div>
      {{testValue}}
    </div>
</template>

<<script>
export default {
  props: ['testValue']
}
</script>

    main.js

    new Vue({
  el: '#app',
  render(h){
    let template = require("./Clips.vue")
    return h(template, {props:{testValue: this.testValue}})
  },
  data:{
    testValue: "hello world!"
  }
})

    工作example .

    回复于

相关问题