<!--
  任何位置内容 - 展开 / 隐藏
  <Vmore :isShow="">
    <div>....</div>
  </Vmore>
-->
<template>
  <div class="vmore">
    <div
      v-if="!show"
      class="vmore-handle"
    >
      <a
        href="#"
        @click.prevent="expandHandle"
      >展开全部 </a>
      <!-- <Icon type="ios-arrow-down" /> -->
    </div>
    <div v-show="show">
      <slot></slot>
    </div>
    <div
      v-if="show"
      class="vmore-handle vmore-up"
    >
      <a
        href="#"
        @click.prevent="expandHandle"
      >部分隐藏 </a>
      <!-- <Icon type="ios-arrow-up" /> -->
    </div>
  </div>
</template>
<script>
export default {
  name: 'Vmore',
  components: {},
  directives: {},
  props: {
    isShow: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      show: this.isShow
    };
  },
  computed: {},
  watch: {},
  created() {},
  beforeMount() {},
  mounted() {},
  beforeDestroy() {},
  destroyed() {},
  methods: {
    expandHandle() {
      this.show = !this.show;
    }
  }
};
</script>
<style lang="less" scoped>
.vmore {
  a {
    color: #F99C34;
  }
  &-handle {
    text-align: right;
    font-size: 13px;
  }
  &-up {
    padding-top: 10px;
  }
}
</style>
