litebar.vue 627 B

123456789101112131415161718192021222324252627282930313233343536
  1. <template>
  2. <div class="banner">
  3. <i class="naf-icons" :class="{ 'naf-icon-unfold': menuCollapse, 'naf-icon-fold': !menuCollapse }" @click="toggleMenu"></i>
  4. <naf-user class="right" />
  5. </div>
  6. </template>
  7. <script>
  8. import NafUser from './user';
  9. export default {
  10. components: {
  11. NafUser,
  12. },
  13. props: {
  14. menuCollapse: Boolean,
  15. },
  16. methods: {
  17. toggleMenu() {
  18. this.$emit('toggle-menu');
  19. },
  20. },
  21. };
  22. </script>
  23. <style lang="less" scoped>
  24. .banner {
  25. // flex: 1;
  26. // display: block;
  27. // align-items: center;
  28. padding: 0 20px;
  29. width: 58%;
  30. clear: both;
  31. .right {
  32. float: right;
  33. }
  34. }
  35. </style>