4.“简阅”——用户头像修改功能(前端)

setting页面点击用户资料跳转到user_info页面，别忘了在pages.json注册新页面

    个人资料

user_info页面对头像做点击事件，点击弹出ActionSheet

js部分的data数据

data() {
        return {
            nickname: uni.getStorageSync('login_key').nickname,
            avatar: uni.getStorageSync('login_key').avatar,
            userId: uni.getStorageSync('login_key').userId
        };
    }

showActionSheet函数

showActionSheet: function() {
            var _this = this;
            uni.showActionSheet({
                itemList: ['拍照', '从相册选择'],
                success: function(res) {
                    console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
                    //选择的是拍照功能
                    if (res.tapIndex == 0) {
                        uni.chooseImage({
                            count: 1,
                            sourceType: ['camera'],
                            success: function(res) {
                                uni.saveImageToPhotosAlbum({
                                    filePath: res.tempFilePaths[0],
                                    success: function() {
                                        console.log('save success');
                                        uni.uploadFile({
                                            url: 'http://****:8080/api/user/avatar', 
                                            filePath: res.tempFilePaths[0],
                                            name: 'file',
                                            formData: {
                                                userId: _this.userId
                                            },
                                            success: uploadFileRes => {
                                                console.log(uploadFileRes.data);
                                                _this.avatar = uploadFileRes.data;
                                            }
                                        });
                                    }
                                });
                            }
                        });
                    }
                    //从相册选择
                    if (res.tapIndex == 1) {
                        uni.chooseImage({
                            count: 1, //默认9
                            sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都
                            sourceType: ['album'], //从相册选择
                            success: function(res) {
                                console.log(JSON.stringify(res.tempFilePaths));
                                uni.uploadFile({
                                    url: 'http://******:8080/api/user/avatar', 
                                    filePath: res.tempFilePaths[0],
                                    name: 'file',
                                    formData: {
                                        userId: _this.userId
                                    },
                                    success: uploadFileRes => {
                                        console.log(uploadFileRes.data);
                                        _this.avatar = uploadFileRes.data;
                                    }
                                });
                            }
                        });
                    }
                },
                fail: function(res) {
                    console.log(res.errMsg);
                }
            });
        }

运行结果

• 蓝墨云班课简阅1.0