index.vue 974 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. <template>
  2. <view class="u-demo">
  3. <view class="u-demo-wrap">
  4. <view class="u-demo-title">演示效果</view>
  5. <view class="u-demo-area">
  6. <view class="u-demo-result-line">
  7. {{result}}
  8. </view>
  9. </view>
  10. </view>
  11. <view class="u-config-wrap">
  12. <view class="u-config-title u-border-bottom">
  13. 参数配置
  14. </view>
  15. <view class="u-config-item">
  16. <view class="u-item-title">源字符串</view>
  17. <u-subsection :list="['Take me', 'to', 'your heart']" @change="getResult"></u-subsection>
  18. </view>
  19. </view>
  20. </view>
  21. </template>
  22. <script>
  23. import md5Libs from "uview-ui/libs/function/md5";
  24. export default {
  25. data() {
  26. return {
  27. result: null,
  28. string: 'Take me'
  29. }
  30. },
  31. onLoad() {
  32. this.getResult();
  33. },
  34. methods: {
  35. getResult(index) {
  36. this.string = index == 0 ? 'Take me' : index == 1 ? 'to' : 'you heart';
  37. this.result = md5Libs.md5(this.string);
  38. }
  39. }
  40. }
  41. </script>
  42. <style lang="scss" scoped>
  43. .u-demo {}
  44. </style>