<div>
<button data-step="-1">-</button>
<button data-step="+1">+</button>
</div>
<textarea cols="30" rows="10"></textarea>
const history = JSON.parse(localStorage.getItem('history')) || [];
let index = history.length - 1;
const $text = $('textarea').change(function() {
index = history.push($text.val()) - 1;
localStorage.setItem('history', JSON.stringify(history));
});
$('[data-step]').click(function() {
goTo(index + +this.dataset.step);
});
goTo(index);
function goTo(newIndex) {
if (0 <= newIndex && newIndex <= history.length - 1) {
index = newIndex;
$text.val(history[index]);
}
}
с data-table vuetify она не работает
<v-data-table
ref="table"
...
table
:mounted() {
new ColumnResizer.default(this.$refs.table.$el.querySelector('table.v-datatable'), {
liveDrag: true,
draggingClass: 'rangeDrag',
gripInnerHtml: '<div class="rangeGrip"></div>',
minWidth: 8,
});
},
arr.map(id => people.find(n => n.id === id))
// или
arr.map(function(n) {
return this[n];
}, people.reduce((acc, n) => (acc[n.id] = n, acc), {}))
people.filter(n => arr.includes(n.id))
// или
people.filter(((ids, n) => ids.has(n.id)).bind(null, new Set(arr)))
<ul>
<li><span>aaa</span></li>
<li>
<span>bbb</span>
<ul>
<li><span>bbb.1</span></li>
<li>
<span>bbb.2</span>
<ul>
<li><span>bbb.2.1</span></li>
<li><span>bbb.2.2</span></li>
</ul>
</li>
<li>
<span>bbb.3</span>
<ul>
<li>
<span>bbb.3.1</span>
<ul>
<li><span>bbb.3.1.1</span></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
document.querySelectorAll('li').forEach(n => {
const count = ((n.querySelector('ul') || {}).children || []).length;
n.querySelector('span').textContent += ` (${count})`;
});
document.querySelectorAll('li').forEach(n => {
const count = n.querySelectorAll('li').length;
n.querySelector('span').textContent += ` (${count})`;
});
При изменении item.department меняется и item_loaded.department
this.item_loaded = this.item
this.item_loaded = { ...this.item }
data() {
return {
item_loaded: { ...this.item },
};
},
isChanged() {
return this.item_loaded.department !== this.item.department;
},
cannot read property of null
. Должен быть объект:default: () => ({ /* можно указать какие-нибудь свойства с дефолтными значениями */ }),
v-model="item.department"
). Правильно будет эмитить изменения в родительский компонент и обновлять объект уже там. В родителе цепляете значение для параметра item с модификатором sync, а в рассматриваемом компоненте v-model
заменяете на установку значения и обработку события input:<input
:value="item.department"
@input="$emit('update:item', { ...item, department: $event.target.value })"
>
class App extends React.Component {
state = {
items: [...Array(20).keys()],
chunkLen: 3,
}
onClick = ({ target: { dataset: { change } } }) => {
this.setState(({ chunkLen }) => ({
chunkLen: Math.max(2, Math.min(9, chunkLen + +change)),
}));
}
render() {
const { items, chunkLen } = this.state;
const chunks = Array.from(
{ length: Math.ceil(items.length / chunkLen) },
(n, i) => items.slice(i * chunkLen, (i + 1) * chunkLen)
);
return (
<div>
<button data-change="-1" onClick={this.onClick}>-</button>
{chunkLen}
<button data-change="+1" onClick={this.onClick}>+</button>
<div>
{chunks.map(chunk => (
<div className="group">
{chunk.map(n => <div className="group-item">{n}</div>)}
</div>
))}
</div>
</div>
);
}
}
:data="chartData"
computed: {
chartData() {
return this.$store.getters.filterManagersChart.map(n => ({
name: n,
data: 53,
}));
},
},
class App extends React.Component {
state = {
items: Array.from({ length: 10 }, (n, i) => ({
id: i + 1,
value: String.fromCharCode(97 + i).repeat(5),
})),
active: [],
}
toggleActive = e => {
const id = +e.target.dataset.id;
this.setState(({ active }) => ({
active: active.includes(id)
? active.filter(n => n !== id)
: [ ...active, id ],
}));
}
render() {
const { items, active } = this.state;
return (
<ul>
{items.map(n => (
<li
key={n.id}
data-id={n.id}
onClick={this.toggleActive}
className={active.includes(n.id) ? 'active' : ''}
>
{n.value}
</li>
))}
</ul>
);
}
}
undefined
относится к falsy значениям, так что с помощью оператора ||
подставляйте пустой объект (или какое-нибудь другое значение - смотрите сами, как вам удобнее) там, где нужное значение может отсутствовать, например:(((lead._embedded.items[0].custom_fields.find(cf => cf.id == PRODUCT_FIELD_ID) || {}).values || {})[0] || {}).value || null
lead._embedded.items[0].custom_fields.find(cf => cf.id == PRODUCT_FIELD_ID)?.values[0].value ?? null
$count = array_count_values($arr);
$arr = array_filter($arr, function($n) use($count) {
return $count[$n] < 2;
});
$count = array_count_values($arr);
$arr = array_unique(array_filter($arr, function($n) use($count) {
return $count[$n] % 2;
}));
const className = 'класс элементов';
.document.querySelectorAll(`.${className}`).forEach((n, i) => {
n.innerText = arr[i];
});
// или
for (const [ i, n ] of document.querySelectorAll(`.${className}`).entries()) {
n.innerHTML = arr[i];
}
// или
arr.forEach(function(n, i) {
this[i].textContent = n;
}, document.getElementsByClassName(className));
// или
const elems = document.getElementsByClassName(className);
for (let i = 0; i < elems.length; i++) {
elems[i].appendChild(document.createTextNode(arr[i]));
}
print(list(filter(lambda n: n % 10 in (2, 3, 4, 5), range(100))))
print([n for n in range(100) if n % 10 in (2, 3, 4, 5)])
print([m + n * 10 for n in range(10) for m in range(2, 6)])
watch: {
measureSystem: {
immediate: true,
handler() {
// сюда переносите код из mounted - axios.get(...)
},
},
},
computed: {
measureSystem() {
return this.toggle === 1 ? 'metric' : 'Imperial';
},
},
$(window).scroll(function onScroll() {
if ($(this).scrollTop() > 777) {
$('.div_clone').clone().appendTo('.container2');
$(this).off('scroll', onScroll);
}
});