let data = {}; await fetch(url).then((res) => res.json()).then(json => { data = { temperature: json.main.temp } }) return data;
return fetch(url).then(r => r.json());.this.setState(() => { return { weather: this.askForWeather.getNeededData() } });
this.askForWeather.getNeededData().then(weather => {
this.setState(() => ({ weather }));
});<Main temperature={this.state.weather.temperature}/>
{this.state.weather && <Main temperature={this.state.weather.main.temp} />}v-model чекбоксов. Вычисляемое свойство, управляющее выбором всех чекбоксов, переписываете следующим образом: в геттере сравниваете длины массивов всех элементов и выбранных, в сеттере устанавливаете значение вычисляемого свойства выбранных элементов. Например.
async function chain(arr) {
const result = [];
for (const item of arr) {
result.push(await item(result[result.length - 1]));
}
return result;
}function chain(arr) {
const result = [];
return arr
.reduce((prev, curr) => prev.then(curr).then(r => (result.push(r), r)), Promise.resolve())
.then(() => result);
}const findInTree = (tree, childrenKey, test) =>
(Array.isArray(tree) ? tree : []).reduce((found, n) =>
found ?? (test(n) ? n : findInTree(n[childrenKey], childrenKey, test))
, null);const findInTree = function(tree, childrenKey, test) {
const stack = [];
for (let [ i, arr ] = this(tree); ++i < arr.length || stack.length;) {
if (i === arr.length) {
[ i, arr ] = stack.pop();
} else if (test(arr[i])) {
return arr[i];
} else {
stack.push([ i, arr ]);
[ i, arr ] = this(arr[i][childrenKey]);
}
}
return null;
}.bind(x => [ -1, x instanceof Array ? x : [] ]);const obj = findInTree(arr, 'children', n => n.id === id);
if (obj) {
obj.isSelected = isSelected;
}data: () => ({
active: null,
}),<div class="item" v-for="i in 5">
<div class="parent" @click="active = active === i ? null : i">
<div class="child" :class="active === i ? 'green' : 'red'">{{ i }}</div>
</div>
</div>data: () => ({
items: Array(5).fill(false),
}),<div class="item" v-for="(n, i) in items">
<div class="parent" @click="$set(items, i, !n)">
<div class="child" :class="{ green: n, red: !n }">{{ i + 1 }}</div>
</div>
</div>props: [ 'text' ],
data: () => ({
active: 0,
}),<div class="item">
<div class="parent" @click="active ^= 1">
<div class="child" :class="[ 'red', 'green' ][active]">{{ text }}</div>
</div>
</div>data: () => ({
items: Array.from({ length: 5 }, (_, i) => `item #${-~i}`),
}),<v-item v-for="n in items" :text="n"></v-item>
setCount(count => count + 1);.что я делаю не так?
arr.reduce((acc, n) => acc + n.startsWith(`${currency} `) * /\d+$/.exec(n), 0)arr.reduce((acc, n) => {
const [ currency, sum ] = n.split(' ');
acc[currency] = (acc[currency] ?? 0) + +sum;
return acc;
}, {})const key = 'type';
const attr = `data-${key}`;
const attrSelector = `[${attr}]`;const getTypeGroup = el => el.dataset[key].replace(/\d/g, '');
// или
const getTypeGroup = el => el.getAttribute(attr).match(/\D+/)[0];
// или
const getTypeGroup = el => el.attributes[attr].value.split(/\d/).shift();document.addEventListener('click', e => {
const el = e.target.closest(attrSelector);
if (el) {
console.log(getTypeGroup(el));
}
});
// или
document.querySelectorAll(attrSelector).forEach(function(n) {
n.addEventListener('click', this);
}, e => console.log(getTypeGroup(e.currentTarget)));что я сделал не так?
ul находятся i и div? Почему li находится внутри div? Разберитесь, кого чьим контентом можно и нельзя делать.#hide должно браться из стейта, обновлять надо стейт; innerText, который вы хотите получить - его также надо брать из стейта.selectItem - подумайте, как его переписать так, чтобы вместо объекта события (который вам нужен ради свойства target, да?) он принимал данные, на основе которых создан li.
const chunked = (data, chunkSize, slice = data.slice) =>
Array.from(
{ length: Math.ceil(data.length / chunkSize) },
function(_, i) {
return this(i * chunkSize, (i + 1) * chunkSize);
},
(slice instanceof Function ? slice : Array.prototype.slice).bind(data)
);const parentSelector = '.row-module';
const wrapperTag = 'div';
const wrapperClass = 'wrap';
const wrapSize = 4;for (const $n of chunked($(parentSelector).children(), wrapSize)) {
$n.wrapAll(`<${wrapperTag} class="${wrapperClass}">`);
}const parent = document.querySelector(parentSelector);
chunked(parent.children, wrapSize).forEach(n => {
parent.append(document.createElement(wrapperTag));
parent.lastChild.classList.add(wrapperClass);
parent.lastChild.append(...n);
});function createPlainArrayFromNested($arr, $path = []) {
$result = [];
foreach ($arr as $key => $val) {
$path[] = count($path) ? "[$key]" : $key;
$result += (is_array($val) && !empty($val))
? createPlainArrayFromNested($val, $path)
: [ implode('', $path) => $val ];
array_pop($path);
}
return $result;
}const containerSelector = '.tabs';
const headerSelector = `${containerSelector} .tabs-nav__item`;
const contentSelector = `${containerSelector} .tab`;
const activeClass = 'is-active';
function setActiveTab(header) {
if (header instanceof Element && header.matches(headerSelector)) {
const container = header.closest(containerSelector);
const headers = container.querySelectorAll(headerSelector);
const contents = container.querySelectorAll(contentSelector);
const index = Array.prototype.indexOf.call(headers, header);
const toggle = (n, i) => n.classList.toggle(activeClass, i === index);
headers.forEach(toggle);
contents.forEach(toggle);
}
}
// делегирование, подключаем обработчик клика один раз для всех
document.addEventListener('click', e => {
setActiveTab(e.target.closest(headerSelector));
});
// или, назначаем обработчик клика индивидуально каждому заголовку
document.querySelectorAll(headerSelector).forEach(function(n) {
n.addEventListener('click', this);
}, e => setActiveTab(e.currentTarget));