home.vue 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. <template>
  2. <view class="home">
  3. 首页
  4. <van-rate value="3" />
  5. <van-button type="default">默认按钮</van-button>
  6. <van-button type="primary">主要按钮</van-button>
  7. <van-button type="info">信息按钮</van-button>
  8. <van-button type="warning">警告按钮</van-button>
  9. <van-button type="danger">危险按钮</van-button>
  10. <view>{{list}}</view>
  11. <!-- selectable 长按选中 -->
  12. <text selectable space="nbsp">内 容</text>
  13. <br />
  14. <text selectable space="emsp">内 容</text>
  15. <br />
  16. <text selectable space="ensp">内 容</text>
  17. <icon type="success" size="30" color="#ff0000"></icon>
  18. <view class="iconfont icon-xingxing"></view>
  19. <view class="iconfont icon-yueliang"></view>
  20. <h1>哈哈哈</h1>
  21. <h2>你好</h2>
  22. <view @click="setName">
  23. 设置姓名
  24. </view>
  25. <button @click="getName">
  26. 图片
  27. </button>
  28. <!-- <view v-for="(item,index) in list" :key="index">
  29. <view>
  30. 哈哈
  31. </view>
  32. </view> -->
  33. <image v-for="(item,index) in list" :key="index" :src="item" mode=""></image>
  34. </view>
  35. </template>
  36. <script>
  37. export default {
  38. data() {
  39. return {
  40. list: []
  41. }
  42. },
  43. methods: {
  44. setName() {
  45. uni.setStorageSync('storage_key', 'hello');
  46. uni.setStorage({
  47. key: 'name',
  48. data: '小明',
  49. success: function() {
  50. console.log('success');
  51. }
  52. });
  53. },
  54. getName() {
  55. uni.chooseImage({
  56. count: 6, //默认9
  57. sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
  58. sourceType: ['album'], //从相册选择
  59. success: function(res) {
  60. console.log(res,'res')
  61. console.log(JSON.stringify(res.tempFilePaths));
  62. this.list = res.tempFilePaths;
  63. console.log(this.list, '列表')
  64. }
  65. });
  66. // uni.clearStorage();
  67. // console.log(uni.getStorage({key: 'name'}));
  68. }
  69. }
  70. }
  71. </script>
  72. <style lang="less">
  73. /* 类 id 标签 伪元素 */
  74. @import url('../../css/common.css');
  75. .home {
  76. // width: 375rpx;
  77. height: 100%;
  78. background: pink;
  79. h2 {
  80. color: yellow;
  81. }
  82. }
  83. /* .home */
  84. /* ::after */
  85. </style>