psaren / taro-ui-vue

UI KIT for Taro/vue
MIT License
206 stars 38 forks source link

AtTabs>AtTabsPane 里的内容没有默认字体大小时,将看不到内容。 #135

Closed abitwhy closed 3 years ago

abitwhy commented 3 years ago

问题描述 如题,为什么没有继承字体大小,有样式隔离吗?

复现步骤 你们自己的示例

<template>
  <view class='panel__content'>
    <AtTabs
      :swipeable="false"
      :current="current1"
      :tabList="tabList1"
      :onClick="handleClick"
    >
      <AtTabsPane :current="current1" :index="0">
        <view class='tab-content'>标签页一的内容</view>
      </AtTabsPane>
      <AtTabsPane :current="current1" :index="1">
        <view class='tab-content'>标签页二的内容</view>
      </AtTabsPane>
      <AtTabsPane :current="current1" :index="2">
        <view class='tab-content'>标签页三的内容</view>
      </AtTabsPane>
    </AtTabs>
  </view>
</template>
<script>
import { AtTabs, AtTabsPane } from 'taro-ui-vue'
export default {
  name: 'AtTabsDemo',
  components:{
    AtTabs,
AtTabsPane
  },
  data() {
    return {
      current1: 0,
      tabList1: [
        { title: '标签页1' },
        { title: '标签页2' },
        { title: '标签页3' }
      ],
    }
  },
  methods: {
    handleClick(value) {
      this.current1 = value
    }
  }
}
</script>
<style lang="scss">
@import "~taro-ui-vue/dist/style/components/tabs.scss"; 
</style>

期望行为 展示内容

报错信息 没有展示出内容 image

系统信息

psaren commented 3 years ago

https://github.com/psaren/taro-ui-vue/blob/215f5dbb14a1e5dddee159dc9d2c363ac6e7df07/packages/taro-ui-vue-demo/src/pages/navigation/tabs/index.vue#L141-L144

demo是有引入字体大小的,在下面第三行 https://github.com/psaren/taro-ui-vue/blob/215f5dbb14a1e5dddee159dc9d2c363ac6e7df07/packages/taro-ui-vue-demo/src/pages/navigation/tabs/index.scss#L1-L6

所以需要定义一下AtTabsPanel内字体大小