12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970 |
- <template>
- <view class="div ui-detail" ref="mbBody">
- <view class="title" id="mbBody"><text class="border"></text><text class="titleinfo">宝贝详情</text><text class="border"></text></view>
- <view class="div">
- <desc-item
- :mbBody="mbBody"
- :detailInfo="detailInfo"
- v-if="detailInfo"
- ></desc-item>
- </view>
- <v-back-top v-if="isshowBacktop" :target="target"></v-back-top>
- </view>
- </template>
- <script>
- import { mapState } from 'vuex'
- import DescItem from './DescItem'
- import BackTop from './DetailBackTop'
- export default {
- data () {
- return {
- isshowBacktop: false
- }
- },
- mounted () {
- setTimeout(() => {
- const mbBodyinfo = uni.createSelectorQuery().in(this)
- mbBodyinfo.select('#mbBody').boundingClientRect(res =>{
- this.$emit('mbBodyposition',res.top - res.height);
- }).exec();
- }, 500);
- },
- components: {
- 'desc-item': DescItem,
- 'v-back-top': BackTop
- },
- computed: mapState({
- detailInfo: state => state.goodsdetail.detailInfo,
- mbBody: state => state.goodsdetail.mbBody
- }),
- methods: {
- }
- }
- </script>
- <style lang="scss" scoped>
- .ui-detail {
- margin: .5rem 0;
- min-height: 10rem;
- position: relative;
- .title{
- font-size: .8rem;
- text-align: center;
- padding: 0.3rem 0;
- display: flex;
- align-items: center;
- justify-content: center;
- .border{
- width: 3rem;
- height: 1px;
- background-color: #eee;
- margin: 0 .5rem;
- }
- }
- }
- </style>
|