跨平台框架Taro开发小程序中遇到的坑

1. 自定义组件样式不生效的问题

   • 组件外部样式不生效

     组件是一个独立的区域，默认外部样式不会影响到组件内的效果，但如果想让组件完全受外界控制，可能通过设置addGlobalClass:true来实现

     // 组件 中设置静态属性
     static options = { 
         addGlobalClass: true 
     }

     如果只是想让个别外部样式在组件内生效，则可以通过props传参的方式实现

     // red为外部样式，如：.red{color:#f00} .footer={position:absolute} 
     <MyComponent mycolor='red' myposition='footer'></MyComponent>

     // 组件内接收 
     export default class MyComponent extends Component{ 
         static externalClasses = ['mycolor','myposition']
         render () { 
             return <View className='myposition'>
             <View className="mycolor">我是自定义组件</View>
             </View> 
         } 
     }

   • 引入样式不生效

     自定义组件对应的样式文件，只对该组件内的节点生效，如果自定义组件中还使用其它第三方组件，则样式不一定生效，另外，尽量使用类选择器设置样式，id选择器，标签选择器，属性等选择器等不能在自定义组件中使用。

   • 自定义组件默认样式

     使用:host选择器，类似于web中设置html,body的样式

         :host{ font-size:16px; color:#58bc58 }

   后期不断更新中...