https://jsfiddle.net/mmx38qxw...
運(yùn)行不通過

<script src="http://unpkg.com/vue/dist/vue.js"></script>
<script src="http://unpkg.com/element-ui/lib/index.js"></script>
<div id="app">
  <bb-son v-model="value"></bb-son>
</div>

script 放在 template 中運(yùn)行錯(cuò)誤

var Main = {
  components: {
    'bb-son': {
      template: `
        <input v-model="value" :style="style1">
        </input>
        <script>
          export default {
            props: {
              value: {
                required: false
              }
            },
            data () {
            },
            computed: {
              style1: function () {
                let result = 'width: 2em;'
                if (!this.value) {
                  result = result + ' color: #0066CC;'
                } else {
                  result = result + ' color: #EA0000;'
                }
                return result
              }
            }
          }
          </script>
      `,
      props: {
        value: {
        }
      },
      data () {
        return {}
      },
      mounted: function () {
        console.info('son mounted, name is,', this.value.name)
      },
      updated: function () {
        console.info('son updated, name is,', this.value.name)
      }
    }
  },
  data () {
    return {
      valuef: {
        name: 'valuef'
      }
    }
  },
  methods: {
    showConsole: function () {
      console.info('current father name is, ', this.father.name)
    }
  }
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')