1、组件的属性
例子:
<template> <div class="hello"> <test-props name="demo" title="我是title" :names="names" ></test-props> </div> </template> <script> import TestProps from 'components/TestProps' export default { name: 'HelloWorld', data () { return { names: '我是Name' } }, components: { TestProps } } </script> <!-- Add "scoped" attribute to limit CSS to this component only --> <style lang="stylus" rel="stylesheet/stylus" scoped> </style>
<template> <div class="testProps"> {{names}} </div> </template> <script> export default { name: 'TestProps', // inheritAttrs: false, // 用来控制是否显示原生属性 props: { names: { type: String, default: '' } } } </script> <style lang="stylus" rel="stylesheet/stylus" scoped> </style>
<template> <div class="testProps"> {{names}} </div> </template> <script> export default { name: 'TestProps', inheritAttrs: false, // 用来控制是否显示原生属性 props: { names: { type: String, default: '' } } } </script> <style lang="stylus" rel="stylesheet/stylus" scoped> </style>
title是原生属性,当inheritAttrs为false时,原生属性不显示