Я спроектировал источник данных, есть поле, в котором при вводе повторяются данные, я хочу использовать это поле как условие запроса, как удалить дублирующийся контент при выборе
Давайте восстановим эту сцену. Конкретная идея состоит в том, чтобы заполнить значение параметра раскрывающегося списка в API. Когда мы используем компонент раскрывающегося списка для привязки содержимого в интерфейсе, его можно отобразить напрямую.
1 Создайте источник данных
Войдите в консоль Weibo, нажмите «Новая модель данных»,
введите имя и логотип
, мы вводим два поля, а именно название проекта и имя задачи,
возвращаемся к списку моделей данных, нажмите «Еще», нажмите «Управление данными»
, чтобы ввести несколько тестовые данные
Наша цель здесь - извлечь информацию о названии проекта и удалить дублирующийся контент.
2 Создание API
Мы можем создать API для дедупликации, нажмите API, нажмите Новые API,
чтобы выбрать пользовательский код
Введите имя и
логотип Введите имя и логотип метода, введите следующий код
module.exports = async function (params, context) {
// 这里是方法入参
const result = await context.callModel({
name: 'xlxxsl_zyo3scs', // 数据模型标识，可以前往「数据源 - 数据模型」列表页查看
methodName: 'wedaGetRecords', // 数据模型方法标识，支持的方法可以前往「数据源 - 数据模型」的任一数据模型详情页查看当前模型支持的方法
params: {
}, // 数据模型方法的入参
});
let records = result.records.map((item)=>{
return item.xmmc
})
let finallyarr = Array.from(new Set(records))
console.log(records)
// 这里返回数据，和出参结构映射
return finallyarr.map((item)=>{
return {
"label":item,
"value":item
}
});
};
Смысл кода, на первом этапе используем API модели данных для получения данных источника данных
const result = await context.callModel({
name: 'xlxxsl_zyo3scs', // 数据模型标识，可以前往「数据源 - 数据模型」列表页查看
methodName: 'wedaGetRecords', // 数据模型方法标识，支持的方法可以前往「数据源 - 数据模型」的任一数据模型详情页查看当前模型支持的方法
params: {
}, // 数据模型方法的入参
});
Если мы получим это сейчас, элементы массива являются объектами, и нам нужно извлечь поле имени проекта, поэтому используйте метод карты массива для повторной обработки результата.
let records = result.records.map((item)=>{
return item.xmmc
})
После того, как у нас есть массив, мы можем удалить дубликаты, использовать структуру данных Set для удаления повторяющихся элементов, преобразовать массив в Set, а затем преобразовать Set обратно в массив.
let finallyarr = Array.from(new Set(records))
Наконец, когда мы возвращаем результат, мы должны преобразовать данные в структуру объекта в соответствии с требованиями раскрывающегося компонента.метка — это отображаемое имя параметра, а значение — выбранное значение параметра.
return finallyarr.map((item)=>{
return {
"label":item,
"value":item
}
});
После того, как код написан, нажмите тест метода, тест прошел успешно, нажмите сопоставление параметров
3 Создайте страницу
Мы создаем страницу и помещаем в нее компонент раскрывающегося списка.
Мы определяем переменную для получения данных из источника данных, выбираем массив для типа и вводим значение по умолчанию. Значение по умолчанию
вводит следующие данные
[{
"label":"","value":""}]
Открываем редактор кода, присваиваем данные API переменным в функции жизненного цикла
export default {
async onPageLoad(query) {
//console.log('---------> LifeCycle onPageLoad', query)
$page.dataset.state.projectitems = await app.cloud.callConnector({
name:'getUniName_nvr1a98',
methodName:'fileterArray',
params:{
}
})
console.log($page.dataset.state.projectitems)
},
onPageShow() {
//console.log('---------> LifeCycle onPageShow')
},
onPageReady() {
//console.log('---------> LifeCycle onPageReady')
},
onPageHide() {
//console.log('---------> LifeCycle onPageHide')
},
onPageUnload() {
//console.log('---------> LifeCycle onPageUnload')
},
}
Затем привяжите данные к компоненту раскрывающегося списка и привяжите его как нашу переменную.
окончательный эффект
Подведем итог
В этой статье мы в основном решили проблему с заполнением выпадающих опций, нам нужно прочитать источник данных через API, затем удалить дублирование и залить его в источник данных.
Многие люди, которые еще не сталкивались с low-code, думают, что low-code — это просто перетаскивание для решения простых задач. На самом деле это недоразумение и неверная оценка. По сути, это набор онлайн-инструментов для разработки, которые можно написать как на переднем, так и на заднем концах. Просто сборка интерфейса производится визуальными средствами, что собственно и для повышения эффективности разработки. Если вы все еще ждете и наблюдаете, вы можете также открыть пробную учетную запись, испытать ее на себе и посмотреть, что может сделать low-code и в какой степени.