uniapp是一款跨平台的应用开发框架，基于Vue.js和小程序原生能力进行封装，旨在帮助开发者快速构建跨平台的应用程序。在uniapp中，可以使用Vue.js语法进行页面开发，同时通过使用小程序原生能力，可以实现调用设备的摄像头、访问本地存储、获取地理位置等功能。

示例一：

在uniapp中，可以使用JavaScript将图片转换为base64编码。Base64编码是一种将二进制数据转换为可见字符的编码方式，可以将图片以文本方式存储或传输。下面是一个示例代码，演示如何在uniapp中使用Vue.js和JavaScript将图片转换为base64编码：

<template><div><input type="file" @change="handleFileChange" /><button @click="convertToBase64">转换为Base64</button><img :src="imageUrl" alt="转换后的图片" /></div>
</template><script>
export default {data() {return {imageUrl: '',file: null};},methods: {handleFileChange(e) {this.file = e.target.files[0];},convertToBase64() {if (this.file) {const reader = new FileReader();reader.readAsDataURL(this.file);reader.onload = (e) => {this.imageUrl = e.target.result;};}}}
};
</script>

以上示例代码演示了一个简单的页面，其中包含一个文件输入框、一个按钮和一个图片展示区域。当用户选择文件后，通过`handleFileChange`方法将选择的文件保存到`file`变量中。当用户点击按钮时，通过`convertToBase64`方法将文件转换为base64编码，并将转换后的结果赋值给`imageUrl`变量，实现图片的展示。

示例二：

// 将图片转为 base64 编码
function imageToBase64(imageUrl, callback) {// 创建一个 Image 对象const img = new Image();// 确保图片已完全加载img.onload = function () {// 创建一个 Canvas 元素const canvas = document.createElement('canvas');const ctx = canvas.getContext('2d');// 设置 Canvas 的宽高等于图片的宽高canvas.width = img.width;canvas.height = img.height;// 将图片绘制到 Canvas 上ctx.drawImage(img, 0, 0);// 获取图片的 base64 编码const base64 = canvas.toDataURL('image/png');// 执行回调函数，将 base64 字符串作为参数传递出去callback(base64);}// 加载图片img.src = imageUrl;
}// 示例调用
const imageUrl = 'https://example.com/image.jpg';
imageToBase64(imageUrl, function (base64) {console.log(base64);
});

通过以上示例，我们可以看到，在uniapp中，通过Vue.js的双向数据绑定机制和JavaScript的`FileReader`对象，可以很方便地将图片转换为base64编码，并在页面中展示出来。这样，我们就可以使用base64编码的图片来替代原始图片，实现在页面中动态显示和传输图片的目的。

你可以将这段代码使用在uni-app、Vue、小程序等前端开发框架中。