tipSelectChange: function (e) { let originalOptions=Object.assign([], this.data.tipSelectOptions); this.setData({ tipConfirmed:originalOptions }) // console.log(e); // console.log(this.data); let index = e.currentTarget.id.replace("tip-", ""); var result = this.data.tipSelectOptions; if (index == 0) { for (let item of result) { item.value = false; } } else { result[0].value = false; } result[index].value = !result[index].value; let flag = true; for (let item of result) { if (item.value !== false) { flag = false; break; } } if (flag) { result[0].value = true; } this.setData({ tipSelectOptions: result, }); },怎么让tipConfirmed不随tipSelectOptions改变
时间: 2024-02-10 19:12:52 浏览: 60
可以使用深拷贝来避免tipConfirmed随着tipSelectOptions的改变而改变。在代码中,可以将Object.assign改为JSON.parse(JSON.stringify())来进行深拷贝,即:
```
let originalOptions = JSON.parse(JSON.stringify(this.data.tipSelectOptions));
this.setData({
tipConfirmed: originalOptions
})
```
这样,tipConfirmed就不会随着tipSelectOptions的改变而改变了。
相关问题
微信小程序 使用setdata直接设置数据绑定,没报错但为什么没结果
### 小程序 `setData` 方法不触发页面更新的原因分析
在微信小程序中,当使用 `setData` 更新数据时,如果发现界面未及时响应变化,可能由以下几个原因引起:
- 数据路径错误:确保传递给 `setData` 的对象键名与 WXML 中绑定的数据完全匹配[^1]。
- 频繁调用 `setData`: 如果短时间内频繁调用此方法可能导致某些更新被忽略。建议减少不必要的重复设置或者合并多次操作成一次批量处理。
- 对象引用不变:对于复杂类型的变量(如数组、对象),直接修改其属性不会触发视图层的变化感知机制;应该创建新实例再赋值给原有变量名称以便框架能检测到差异并重新渲染[^2]。
#### 实际案例中的常见误区及修正方式
针对上述提到的情况,在实际编码实践中应注意如下几点:
- **避免浅拷贝**
当尝试更改列表项或字典条目时,简单的原位变更无法让小程序识别变动。应采用深复制策略生成新的集合结构后再执行 `setData`:
```javascript
let newList = [...this.data.list]; // 使用扩展运算符实现深层克隆
newList[index].property = newValue;
this.setData({
list: newList,
});
```
- **防止过度调用**
若业务逻辑涉及连续性的状态迁移,则可考虑累积待办事项直至必要时刻统一提交至 UI 层:
```javascript
const updates = {};
function accumulateUpdate(key, value){
Object.assign(updates, {[key]:value});
}
...
this.setData(updates);
```
- **确认上下文正确**
确认当前作用域内的 `this` 指向的是 Page 或 Component 实例本身而非其他环境下的代理对象。这通常发生在事件处理器或其他异步回调场景下:
```javascript
Page({
onLoad() {
var that = this; // 显式保存外部 'this'
someAsyncOperation().then(function(result){
that.setData({...}); // 正确做法
});
// 错误示范
/*
someAsyncOperation().then((result)=>{
this.setData({...}); // 'this' 可能在箭头函数外丢失指向
});
*/
},
})
```
C:\Users\tanji\Desktop\QCP\Demo03\mainwindow.cpp:86: error: 'startSelection' is a protected member of 'QCPSelectionRect'
这个错误是因为你尝试在 `QCPSelectionRect` 类外部调用其受保护的成员函数 `startSelection`,而受保护的成员函数只能在该类的派生类或友元类中访问。
如果你想在 `mainwindow.cpp` 中使用 `startSelection` 函数,你需要将 `QCPSelectionRect` 类的定义添加到 `mainwindow.h` 的头文件中,并在 `QCPSelectionRect` 类的定义前加上 `friend class MainWindow;`,以使 `MainWindow` 类成为 `QCPSelectionRect` 类的友元类。这样,在 `MainWindow` 类中就可以访问 `QCPSelectionRect` 的受保护成员函数了。
示例代码:
mainwindow.h:
```cpp
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
#include <QMainWindow>
#include "qcustomplot.h"
class QCPSelectionRect;
namespace Ui {
class MainWindow;
}
class MainWindow : public QMainWindow
{
Q_OBJECT
public:
explicit MainWindow(QWidget *parent = nullptr);
~MainWindow();
private:
Ui::MainWindow *ui;
QCustomPlot *customPlot;
QCPSelectionRect *selectionRect;
private slots:
void selectionRectStarted(QMouseEvent *event);
void selectionRectChanged(const QRect &rect, QMouseEvent *event);
void selectionRectEnded(QMouseEvent *event);
};
#endif // MAINWINDOW_H
```
mainwindow.cpp:
```cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"
#include "qcustomplot.h"
class QCPSelectionRect;
MainWindow::MainWindow(QWidget *parent) :
QMainWindow(parent),
ui(new Ui::MainWindow)
{
ui->setupUi(this);
// create graph and assign data to it:
customPlot = new QCustomPlot(this);
customPlot->addGraph();
QVector<double> x(101), y(101); // initialize with entries 0..100
for (int i=0; i<101; ++i)
{
x[i] = i/50.0 - 1; // x goes from -1 to 1
y[i] = x[i]*x[i]; // let's plot a quadratic function
}
customPlot->graph(0)->setData(x, y);
// set axes ranges, so we see all data:
customPlot->xAxis->setRange(-1, 1);
customPlot->yAxis->setRange(0, 1);
// create selection rect:
selectionRect = new QCPSelectionRect(customPlot);
selectionRect->setPen(QPen(Qt::blue, 2, Qt::DashLine));
// connect signals of selection rect:
connect(selectionRect, SIGNAL(selectionStart(QMouseEvent*)), this, SLOT(selectionRectStarted(QMouseEvent*)));
connect(selectionRect, SIGNAL(selectionChanged(QRect,QMouseEvent*)), this, SLOT(selectionRectChanged(QRect,QMouseEvent*)));
connect(selectionRect, SIGNAL(selectionEnd(QMouseEvent*)), this, SLOT(selectionRectEnded(QMouseEvent*)));
// set central widget:
setCentralWidget(customPlot);
}
MainWindow::~MainWindow()
{
delete ui;
}
void MainWindow::selectionRectStarted(QMouseEvent *event)
{
customPlot->graph(0)->clearData();
}
void MainWindow::selectionRectChanged(const QRect &rect, QMouseEvent *event)
{
// do something with rect, e.g. translate to QCPAxisRect coordinates, then set this as clipRect for the respective axis rect:
customPlot->xAxis->setRange(customPlot->xAxis->pixelToCoord(rect.left()), customPlot->xAxis->pixelToCoord(rect.right()));
customPlot->yAxis->setRange(customPlot->yAxis->pixelToCoord(rect.bottom()), customPlot->yAxis->pixelToCoord(rect.top()));
customPlot->replot();
}
void MainWindow::selectionRectEnded(QMouseEvent *event)
{
// reset data and axes ranges:
QVector<double> x(101), y(101);
for (int i=0; i<101; ++i)
{
x[i] = i/50.0 - 1;
y[i] = x[i]*x[i];
}
customPlot->graph(0)->setData(x, y);
customPlot->xAxis->setRange(-1, 1);
customPlot->yAxis->setRange(0, 1);
customPlot->replot();
}
// make MainWindow a friend of QCPSelectionRect
class QCPSelectionRect
{
friend class MainWindow;
protected:
void startSelection(QMouseEvent *event) { QCPAbstractItem::startSelection(event); }
};
```
阅读全文
相关推荐















