make-phone-call.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. <template>
  2. <view>
  3. <page-head :title="title"></page-head>
  4. <view class="uni-padding-wrap uni-common-mt">
  5. <view class="uni-hello-text uni-center">请在下方输入电话号码</view>
  6. <input class="input uni-common-mt" type="number" name="input" @input="bindInput" />
  7. <view class="uni-btn-v uni-common-mt">
  8. <button @tap="makePhoneCall" type="primary" :disabled="disabled">拨打</button>
  9. </view>
  10. </view>
  11. </view>
  12. </template>
  13. <script>
  14. export default {
  15. data() {
  16. return {
  17. title: 'makePhoneCall',
  18. disabled: true
  19. }
  20. },
  21. methods: {
  22. bindInput: function (e) {
  23. this.inputValue = e.detail.value
  24. if (this.inputValue.length > 0) {
  25. this.disabled = false
  26. } else {
  27. this.disabled = true
  28. }
  29. },
  30. makePhoneCall: function () {
  31. uni.makePhoneCall({
  32. phoneNumber: this.inputValue,
  33. success: () => {
  34. console.log("成功拨打电话")
  35. }
  36. })
  37. }
  38. }
  39. }
  40. </script>
  41. <style>
  42. .input {
  43. height: 119rpx;
  44. line-height: 119rpx;
  45. font-size: 78rpx;
  46. border-bottom: 1rpx solid #E2E2E2;
  47. text-align:center;
  48. }
  49. </style>