Navbar.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <template>
  2. <div class="m-page-header">
  3. <h3>
  4. <span class="glyphicon glyphicon-circle-arrow-left m-page-header-image"
  5. @click="goBack"
  6. v-if="isGoBack == true || isGoBack == 'true'"></span>
  7. {{title}}
  8. <div class="pull-right">
  9. <slot></slot>
  10. </div>
  11. </h3>
  12. </div>
  13. </template>
  14. <script>
  15. module.exports = {
  16. name: "Navbar",
  17. props: [
  18. //是否需要返回按钮,true:需要返回按钮,false:不需要返回按钮
  19. "isGoBack",
  20. //标题
  21. "title"
  22. ],
  23. data: function () {
  24. return {
  25. data: "",
  26. }
  27. },
  28. components: {
  29. },
  30. methods: {
  31. goBack: function () {
  32. history.back();
  33. }
  34. },
  35. }
  36. </script>
  37. <style scoped>
  38. .m-page-header {
  39. margin: 5px;
  40. padding: 0px;
  41. border-bottom: 1px solid #eee;
  42. }
  43. .m-page-header h3 {
  44. margin: 0px;
  45. padding: 5px 0px 5px 0px;
  46. }
  47. .m-page-header-image {
  48. top: 4px;
  49. cursor: pointer;
  50. }
  51. </style>