0xD34F

Да так же, как и везде - добавляете атрибут type="password".

data: () => ({
  value: '',
  error: false
}),
methods: {
  checkValue() {
    this.error = в зависимости от this.value;
  }
}

<input v-model="value" :class="{ error }" @blur="checkValue">
<span v-show="error">ошибка</span>

.error {
  border-color: red;
}

https://jsfiddle.net/ujr0bgLv/

const msgArr = msg.trim().replace(/[-,]/g, '').split(/\s+/);

Как можно его подключить в проект без использования webpack, vue-cli?

"Подключить" - никак (по крайней мере, в документации иных способов кроме как с использованием сборщиков не упоминается). Можно разве что утащить исходники, и... Вот. Это, разумеется, дикость. Освойте лучше vue-cli - там нет ничего сложного.

UPD [Дописано сильно позднее]. Появилась возможность подключить через cdn. Например.

document.querySelectorAll('.item-parent').forEach(n => {
  n.insertAdjacentHTML('beforeend', '<div class="item-decor"></div>');
});

или

for (const n of document.getElementsByClassName('item-parent')) {
  const div = document.createElement('div');
  div.classList.add('item-decor');
  n.appendChild(div);
}

function prev(el, selector) {
  if (el instanceof HTMLElement) {
    el = el.previousElementSibling;
    return el && (!selector || el.matches(selector)) ? el : null;
  }

  if (el && Number.isInteger(el.length) && el.length >= 0) {
    return Array.prototype.reduce.call(
      el,
      (acc, n) => ((n = prev(n, selector)) && acc.push(n), acc),
      []
    );
  }

  return null;
}


// можно передавать как одиночный элемент (результатом будет тоже элемент или null)...
prev(document.body)

// ... так и коллекции (результатом будет массив)
prev(document.images)
prev(document.querySelectorAll('div'), 'span')

А вообще - загляните-ка сюда.

v-model

При необходимости обновить значение путём записи свойства value у поля ввода, после собственно установки значения, надо будет отправить ему событие input, которое слушает v-model:

input.value = какое-то значение;
input.dispatchEvent(new Event('input'));

Вот так. Данные строки таблицы доступны через параметры слота. Например (кнопка Info).

почему то, выводятся данные в виде undefined

Да понятно почему - вы ничего не возвращаете из метода getFriends.

То есть, должно быть так:

getFriends() {
  return Vue.axios.get(...

Использовать, соответственно, как-то так:

this.$friends.getFriends().then(friends => console.log(friends))

Контекст потеряли. Так что this в then/catch - это не экземпляр компонента, а window (или undefined - в строгом режиме).

Используйте стрелочную функцию:

.then((response) => {
  this.loading = false;
  console.log(response);
})

Или bind:

.then(function(response) {
  this.loading = false;
  console.log(response);
}.bind(this))

Или сохраняйте контекст в переменную перед запросом:

var that = this;
axios.post('/comment', {
  text: this.com_text,
}).then(function(response) {
  that.loading = false;
  console.log(response);
})

Или сделайте метод асинхронным и вместо then используйте await:

methods: {
  async add_comm() {
    this.loading = true;

    try {
      var response = await axios.post('/comment', {
        text: this.com_text
      });

      console.log(response);
    } catch(error) {
      console.error(error);
    }

    this.loading = false;
  }
}

Или вынесите код коллбеков в отдельные методы (vue самостоятельно привязывает контекст к методам):

methods: {
  add_comm() {
    this.loading = true;

    axios.post('/comment', {
      text: this.com_text
    })
      .then(this.onResponse)
      .catch(this.onError)
      .finally(this.onFinal);
  },
  onResponse(response) {
    console.log(response);
  },
  onError(error) {
    console.error(error);
  },
  onFinal() {
    this.loading = false;
  }
}

Добавьте специфичности селектору, объявленному в родителе.

А вы в курсе, что fetchAll возвращает массив? Вынесите fetchAll из цикла, или используйте fetch.

То есть, должно быть так:

$rows = $result->fetchAll();
foreach ($rows as $row) {

Или так:

while ($row = $result->fetch()) {

SELECT range_id, MIN(sernum), MAX(sernum)
FROM table_name
GROUP BY range_id

<div :class="`profile ${userdata.auth_service}`">

или

<div :class="[ 'profile', userdata.auth_service ]">

или

<div class="profile" :class="userdata.auth_service">

Вместо :src="getImgUrl(diaryIcons) сделайте :src="getImgUrl(icons).

Соответственно, в методе getImgUrl избавьтесь от цикла:

getImgUrl(icon) {
  var images = require.context('../../../../assets/icons/', false, /\.png$/)
  return images('./' + icon.name + '.png')
}

const $sorted = $('table tr').sort(el => $(el).hasClass('important') ? -1 : 1);
$sorted.appendTo($sorted.parent());

или

const $important = $('table tr.important');
$important.parent().prepend($important);

data: () => ({
  focused: false,
}),

<input @focus="focused = true" @blur="focused = false">
<span v-show="focused">FOCUSED</span>

https://jsfiddle.net/mc69wnwu/

Есть тип данных interval - используйте его. Как подсказывает документация, его точность - до одной микросекунды, а диапазон значений... в общем, вам хватит.

Получить элемент:

const $el = $('[data-value]');
// или
const el = document.querySelector('[data-value]');

Достать из элемента значение атрибута:

const str = $el.data('value');
// или
const str = $el.attr('data-value');
// или
const str = el.dataset.value;
// или
const str = el.getAttribute('data-value');
// или
const str = el.attributes['data-value'].value;

Сделать из полученной строки массив:

const arr = str.split(',');
// или
const arr = str.match(/\d+/g) || [];
// или
const arr = str.split(/\D/);
// или
const arr = JSON.parse(`[${str}]`); // вместо строк тут будут числа
// или
const arr = eval('[' + str + ']'); // и тут тоже числа

Есть, position называется. Только это не аналог один в один - синтаксис отличается.

Если в mysql вы пишите locate('cde', 'abcdef'), то в postgres будет так: position('cde' in 'abcdef').