link:./path или file:./path.
Vue.component('style-slot', {
functional: true,
render(h, {scopedSlots, data}) {
if (!scopedSlots.default) return;
const map = ['class','staticClass','style','staticStyle'];
const elements = scopedSlots.default();
return elements.map(vNode => {
if (!vNode.tag) return vNode;
let vData;
if (vNode.data) {
vData = Object.assign({}, vNode.data);
map.forEach((key, i) => {
const dataKey = map[i - i % 2];
if(key in data) {
if(dataKey in vNode.data) {
vData[dataKey] = Array.isArray(vData[dataKey])
? vData[dataKey].concat(data[key])
: [vData[dataKey], data[key]];
}
else
vData[dataKey] = data[key];
}
});
} else {
vData = map.reduce((obj, key, i) => {
if(key in data)
obj[key] = data[key];
return obj
}, {});
}
return h(vNode.tag, vData, vNode.children || vNode.text)
})
}
})<template>
<div>
<style-slot class="sl-sl" style="border:2px">
<slot/>
</style-slot>
</div>
</template><template>
<div>
<slot className="slot-class"/>
</div>
</template><template>
<component-a v-slot="{className}">
<p :class="['p-class', className]">text</p>
</component-a>
</template>mapGetters отрабатывает на этапе создания компонента, очевидно что без mapGetters, просто ручками.computed: {
getterResult() {
return this.$store.getters[this.getter]
}
}@/assets/images/image.jpeg не существует. Это не волшебство. На этапе компиляции vue-compiler проходится по известному списку атрибутов, а postcss по стилям и заменяют такие пути на результаты loader'a(по умолчанию: data-uri для мелких файлов и внутренние пути относительно spa для остальных). Простые произвольные строки(которой и является `url(@/assets/images/image.jpeg) no-repeat center`) само собой анализу и замене не подвергаются. require('путь')) и использовать его где нужно.:style="`background: url(${require('@/assets/images/image.jpeg')}) no-repeat center`"this.name, а проект должен работать в любых условиях, то для работы import(`mdi-vue/${this.name}`) собирается вообще всё, что лежит в папке mdi-vue/.
<ul class="nav flex-column nav-pills side-nav" id="v-pills-tab" role="tablist" aria-orientation="vertical">
<router-link tag="li" class="list-group-item" active-class="activ" to="/nutrition/foodmenu">Перспективное меню</router-link>
<router-link tag="li" class="list-group-item" active-class="activ" to="/nutrition/journal">Журнал питания</router-link>
<router-link tag="li" class="list-group-item" active-class="activ" to="/nutrition/ambarbook">Амбарная книга</router-link>
</ul>module.exports = {
css: {
loaderOptions: {
sass: {
prependData({resourcePath}) {
const vueFileName = resourcePath.match(/([^\\\/]+).vue$/i);
if(vueFileName)
return `$vue-file-name: "${vueFileName[1]}"`
}
}
}
}
}$vue-file-name с именем файла.
var app = new Vue({
el: '#vue-app-one',
data: {
sitename: 'The Shop',
string: 'Hello',
product: {
id: 1001,
title: 'Phone',
description: 'The best one <em>phone</em> ever',
price: 1000000,
image: 'This is an image',
},
filters: {
formatPrice: function(price){
if (!parseInt(price)) {return "";}
if (price > 9999){
var priceString = (price /100).toFixed(2);
var priceArray = priceString.split("").reverse();
var index = 3;
while (priceArray.length > index +3){
priceArray.splice(index+3, 0, ',');
index +=4;
}
return '$' + priceArray.reverse().join('');
} else{
return '$' + (price/100).toFixed(2);
}
}
}
},
});tab.form, и отталкиваясь от позиции элемента фокусировать следующий.dom, и также не обязательно, что следующим в фокусе должен быть именно следующий по порядку. Для всего этого и придуман tabindex.
title, который есть в url, а с id, который передаётся скрыто и, само собой, при обновлении страницы ни откуда не появится магическим образом. Обновление страницы - это, по сути, просто новый переход по тому url, который лежит в адресной строке. Если адресная строка не даёт вашим компонентам достаточно информации для понимания, что именно отображать - как они вам отобразят то, что вы хотите? title и id, или запросы вовсе должны идти на сервер по title. title и id для конкретного пользователя, но это сделает ссылки бессмысленными и невозможными к передаче другим.
@click.native="doSomething".