index.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. <template>
  2. <gracePage headerBG="#F5F6F8" :headerHeight="0" :isSwitchPage="true">
  3. <!-- 页面主体 -->
  4. <view slot="gBody" class="demo_body">
  5. <view class="demo">
  6. <image src="https://graceui.oss-cn-beijing.aliyuncs.com/demo2.1/logo2.png" class="index_logo" mode="widthFix"></image>
  7. </view>
  8. <view class="demo">
  9. <text class="grace-text-small grace-black9">兼容uni-app及微信小程序的优秀前端框架\n</text>
  10. <text class="grace-text-small grace-black9">您已成功部署GraceUI请开始编写您的代码</text>
  11. </view>
  12. <view class="demo">
  13. <graceFlex :classes="['nowrap', 'ycenter']">
  14. <text class="grace-text-small grace-black9" style="margin-right:10rpx;">官网 : </text>
  15. <graceLink url="http://grace.hcoder.net" title="http://grace.hcoder.net"></graceLink>
  16. </graceFlex>
  17. </view>
  18. </view>
  19. </gracePage>
  20. </template>
  21. <script>
  22. import gracePage from "../../graceUI/components/gracePage.vue";
  23. import graceFlex from "../../graceUI/components/graceFlex.vue";
  24. import graceLink from "../../graceUI/components/graceLink.vue";
  25. // 演示调用 common.js
  26. var common = require('../../common.js');
  27. export default {
  28. data() {
  29. return {
  30. }
  31. },
  32. onLoad:function(){
  33. common.myfun();
  34. },
  35. methods:{
  36. },
  37. components:{
  38. gracePage, graceFlex , graceLink
  39. }
  40. }
  41. </script>
  42. <style>
  43. .demo_body{padding:200rpx 138rpx;}
  44. .index_logo{width:320rpx; height:52rpx; margin-top:188rpx;}
  45. .demo{width:100%; margin-top:20rpx;}
  46. </style>