uni-app配置微信小程序resizable:true无效

开发环境	版本号	项目创建方式
Windows	Windows 11	HBuilderX
	专业版 23H2

HBuilderX	4.29
第三方开发者工具	1.06.2409131win32-x64
基础库	3.5.8

产品分类：uniapp/小程序/微信

## 示例代码：

/* 小程序特有相关 */
“mp-weixin”: {
“appid”: “”,
“setting”: {
“urlCheck”: false,
“es6”: false,
“postcss”: true,
“minified”: true
},
“resizable”: true,
“usingComponents”: true,
“lazyCodeLoading”: “requiredComponents”
},


## 操作步骤：
到Uniapp开发工具中找到”manifest.json“文件，在"mp-weixin"节点中添加”resizable: true“，之后运行到微信小程序开发工具中，点击预览选择自动预览，后点击PC预览。

## 预期结果：
在PC微信启动预览小程序后，窗口右上角应当出现全屏按钮

## 实际结果：
在PC微信启动预览小程序后，窗口右上角没有出现全屏按钮

## bug描述：
根据Uniapp官方文档”https://uniapp.dcloud.net.cn/collocation/manifest.html#mp-weixin“，中的”resizable“配置项提示，进行配置，想要达到微信小程序官方文档中的”https://developers.weixin.qq.com/miniprogram/dev/framework/view/resizable.html#%E5%90%AF%E7%94%A8%E5%A4%A7%E5%B1%8F%E6%A8%A1%E5%BC%8F“效果，可是没有生效，在编译后的产物中，app.json中也并未出现”resizable:true“配置。

yibo5220 1楼•5 小时前

在uni-app中配置微信小程序 resizable: true 无效的问题，通常与uni-app框架本身对微信小程序的支持以及微信小程序的特性有关。resizable 属性在H5环境中通常用于设置窗口是否可以调整大小，但在微信小程序中并不直接支持这一属性，因为微信小程序是基于微信客户端的封闭环境，窗口大小由微信客户端控制，不允许开发者自定义调整。

不过，如果你的目的是实现类似“可拖动”或“可调整布局”的效果，你可以通过一些自定义的方式来实现，比如使用拖拽事件和动态调整布局的方式。以下是一个简单的代码示例，展示如何在uni-app中模拟一个可拖拽调整大小的组件（注意，这不是真正的窗口大小调整，而是模拟的组件大小调整）：

<template>
  <view class="container">
    <view class="resizable-box" @touchstart="onTouchStart" @touchmove="onTouchMove" :style="boxStyle">
      <view class="resizer" @mousedown.prevent @touchstart.prevent></view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      boxWidth: 200,
      boxHeight: 150,
      startX: 0,
      startY: 0,
      initialWidth: 200,
      initialHeight: 150,
      isDragging: false,
    };
  },
  computed: {
    boxStyle() {
      return `width: ${this.boxWidth}px; height: ${this.boxHeight}px;`;
    },
  },
  methods: {
    onTouchStart(e) {
      this.startX = e.touches[0].clientX;
      this.startY = e.touches[0].clientY;
      this.initialWidth = this.boxWidth;
      this.initialHeight = this.boxHeight;
      this.isDragging = true;
    },
    onTouchMove(e) {
      if (this.isDragging) {
        let deltaX = e.touches[0].clientX - this.startX;
        let deltaY = e.touches[0].clientY - this.startY;
        this.boxWidth = this.initialWidth + deltaX;
        this.boxHeight = this.initialHeight + deltaY;
      }
    },
  },
};
</script>

<style>
.container {
  width: 100%;
  height: 100%;
  position: relative;
}
.resizable-box {
  position: absolute;
  top: 50px;
  left: 50px;
  background-color: lightblue;
  overflow: hidden;
}
.resizer {
  width: 10px;
  height: 10px;
  background-color: darkblue;
  position: absolute;
  right: -5px;
  bottom: -5px;
  cursor: se-resize;
}
</style>

这段代码创建了一个可拖拽调整大小的组件，通过监听触摸事件来动态调整组件的宽度和高度。虽然这不是直接解决resizable: true无效的问题，但它提供了一种在微信小程序中实现类似效果的思路。