pablohpsilva

<template lang="html">
  <div @click="clicked()">oi</div>
</template>

<script type="text/babel">
  import ProductItem from '../../shared-components/Item';

  export default {
    extends: { // The Magic is happening right here
      props: {

pablohpsilva

<template lang="html">
  <div class="ProductItem__wrapper"
    v-if="product">
    <div class="ProductItem__img"
      @click.stop="openProductPage()">
      <img :src="product.image" alt="">
    </div>
    <div class="ProductItem__infowrapper">
      <div :class="{
        'ProductItem__infocontainer': !openDetails,

pablohpsilva

Vue.filter('formatResult', function(value, functionArray){
    if (functionArray) {
        let rList = value,
            aux = [];
        for (let i = 0, total = functionArray.length; i < total; i++) {
            aux = [rList].concat((functionArray[i]).args);
            rList = (functionArray[i]).func.apply(null, aux);
        }
        return rList;
    }

pablohpsilva

<style>
</style>

<template>
    <div class="" v-for="item in list | formatResult filter">
        {{item}}
    </div>
</template>

<script type="text/babel">

pablohpsilva

/**
 * formatResult receives a value a.k.a. the list being filtered and an array
 * of filter functions, using the structure I created and mentioned before.
 * The idea here is to get every item in the array function and use it on
 * the list. The result list of each filter will be used in the next
 * round of filters. Keep in mind the structure I used before.
 */
export const formatResult = (value, functionArray) => {
    if (functionArray) {
        let rList = value,

pablohpsilva

{
	id: String, //Filter's identifier
	args: Array, //an Array that will apply on the function here declared
	func: Function //The filter per se.
}