Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.js"></script>
</head>
<body>
  <template id="temp">
    <div>
      <input v-model="obj.name">
      <button>{{obj.name}}</button>
    </div>
  </template>
  <div id="exp">
    <h3>父组件</h3>
      <input v-model="obj.name">
      <button>{{obj.name}}</button>
    <h3>子组件</h3>
      <child :obj="obj" ></child>
  </div>
</body>
</html>
 
var vm = new Vue({
  el: '#exp',
  data: {
    obj:{
      name: 'oo'
    }
  },
  components:{
    'child':{
      template: '#temp',
      props: ['obj']
    }
  }
});
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
mengQ99pro
0viewers