JSFiddle - React, Tailwind, and code Playground

by lega911

HTML

<script src="//angularlight.org/bin/alight_0.12.last.min.js"></script>
<div al-app="main">

<ul>
    <li al-repeat="i in list" al-class="uniq: i.uniq">
      <button @click="up($index)" :hidden="$index<1">up</button>
      {{i.name}}
    </li>
</ul>

</div>

CSS

.uniq {
  background-color: red;
}

JavaScript

function main(scope) {
	scope.list = [
  	{name: 'Элемент 1'},
  	{name: 'Элемент 2'},
  	{name: 'Элемент 3'},
  	{name: 'Элемент который нужно переместить на один выше', uniq: true},
  	{name: 'Элемент 4'},
  ];
  
  scope.up = function(i) {
  	var t = scope.list[i];
    scope.list[i] = scope.list[i-1];
    scope.list[i-1] = t;
  }
}