max_bu

Второй линк в гугле по запросу "js array min"
https://stackoverflow.com/questions/1669190/find-t...

function arrayMin(arr) {
  return arr.reduce(function (p, v) {
    return ( p < v ? p : v );
  });
}

function arrayMax(arr) {
  return arr.reduce(function (p, v) {
    return ( p > v ? p : v );
  });
}

Upd:

var array = [ 
 { base : 10, upOne: 2, upTwo: 5, upThree: 9}, // 26
 { base : 14, upOne: 1, upTwo: 3, upThree: 5}, // 23
 { base : 11, upOne: 2, upTwo: 3, upThree: 9} // 25
 ]

let selected = ['upOne', 'upTwo']

let getSum = (el) => {
  let r = el.base
  selected.forEach(i => r+= el[i])
  return r
}

function arrayMin(arr) {
  return arr.reduce(function (i, ac) {
    return ( getSum(i) < getSum(ac) ? i : ac );
  });
}

console.log(arrayMin(array))

Вам от Васи надо принимать массив чекбоксов, которые он активировал. Как-то так:

var request = ['upOne', 'upThree']; // Допустим, Вася выбрал эти чекбоксы

function getSumm (ar, fields) {
// Сумма изначально равна base
var summa = ar.base || 0;
// Прибавляем значения из upOne и upThree
    fields.forEach(function( e ){
        summa += arr[e];
    });
return summa;
}

// array - взял из вашего примера, не стал объявлять только, лень.
// Считаем получившуюся сумму и сортируем массив
array.sort( function(a,b){
var summA = getSumm(a, request);
var summB = getSumm(b, request);
return summA - summB;
});

// Первый объект будет с наименьшей суммой.
var result = array[0];

Решение сортировкой. В результате пользователю просто отдаем первый (нулевой) элемент массива.
Идею нужно развить до нескольких чекбоксов, ничего сложного.

var selected = 'value2'; // Вместо чекбокса, суммироваться будет значение value1 и значение указанного в данной переменной свойства объекта.

var data = [
    {id: 1, value1: 1, value2: 23, value3: 1},
    {id: 2, value1: 3, value2: 3, value3: 2},
    {id: 3, value1: 1, value2: 6, value3: 4},
    {id: 4, value1: 23, value2: 8, value3: 67}
];

data.sort(function (x, y) {
    return x.value1 - y.value1 + x[selected] - y[selected];
});

var i;
for (i = 0; i < data.length; i++) {
    document.write("<p>id: " + data[i].id + " sum of value1 and " + selected + ": " + (data[i].value1 + data[i][selected]) + "</p>");
}

jsfiddle.net/n04878oj

В случае не связанных иерархически (не имеющих общего родителя, например), можно использовать:
1) Общий стор (vuex)
2) Event Bus

В случа однофайловых компонентов event bus это просто js-файл с содержимым:

import Vue from 'vue';
export const EventBus = new Vue();

Например есть два компонента: карточка товара (где-то в середине страницы) и корзина (где-то в шапке):

1) В обоих компонентах импортируем bus
import { EventBus } from './event-bus.js';
2) В компоненте карточки в вызове метода, например, addToCart:

methods: {
	addToCart: function() {
    	EventBus.$emit('add-to-cart', 1);
	}
}

3) В корзине:

EventBus.$on("add-to-cart", count => {
	console.log(`Cart updated on ${count} items.`)
})

Как сделать так, чтобы эти компоненты появлялись только после взаимодействия с ними пользователя на прошлом шаге? (т.е 2 появляется после того как пользователь выбрал значение на первом и тд..)

В случае приведенной вами иерархии:

<App>
	<StepOne></StepOne>
	<StepTwo v-if="isListItemSelected"></StepTwo>
	<StepThree v-if="isRangeShowing"></StepThree>
</App>

Можно вынести в data компонента App параметры isListItemSelected (значение выбрано из списка), isRangeShowing (показан ползунок) со значениями false по умолчанию (по поводу StepOne - непонятно из вопроса показан ли он изначально).

В компоненте StepOne, как только пользователь выберет значение, можно делать $emit (без event-bus, потому что есть отношения родитель-потомок), в App ловить событие через $on и менять значение, в случае StepOne - isListItemSelected = true. То же самое и с остальными.

Если надо что-то менять при перемещении ползунков - то когда из компонента с ними делаете $emit и меняете какие-то значения в родительском App - их можно спускать через props в следующий компонент:

<StepThree v-if="isRangeShowing" :range="rangeValues"></StepThree>

и не забыть указать в StepThree параметр props: ['range'].