Vue 2.0 Hello World

by Edward Tanguay

HTML

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/lodash"></script>
<div id="app">
  <p>{{ message }}</p>
  <test-component v-bind="propsFor('test-component', {name: 'Jim', place: 'here'})"></test-component>
</div>

JavaScript

Vue.component('test-component', {
  props: ['name'],
  render(h) { 
  	return h('div', this.name);
  }
})

var app = new Vue({
  el: '#app',
  data: {
    message: 'Testing'
  },
  methods: {
    propsFor(componentName, props = this.$props) {
      const cTor = this.$options.components[componentName]
      if (cTor) {
        const keys = Object.keys(cTor.options.props)
        return _.pick(props, keys) // https://lodash.com/docs/4.17.4#pick
      } else {
        return {}
      }
    }
}

})

console.log(app)