title: filter and sort an array of objects in Vue
body: <p>I'm trying to create a filtered and sorted computed in Vue that is based on an array of objects but have not figured out how to get it to work.  The project has access to the vue-filter library.</p>
  
  <p>Here are the pertinent pieces of code:<br>
  in script tags -</p>
  
  <pre><code>export default {
      computed: {
          filteredOfficialScenarios() {
              return [
                  {"scenarioName": "scenario 1", "created": "2020-01-01T10:30:00"},
                  {"scenarioName": "scenario 2", "created": "2019-01-01T09:15:00"},
                  {"scenarioName": "scenario 3", "created": "2020-01-15T11:00:00"},
                  {"scenarioName": "scenario 4", "created": "2018-01-31T11:00:00"},
                  {"scenarioName": "scenario 5", "created": "2019-01-31T11:00:00"}
              ];
          }
      }
  }
  </code></pre>
  
  <p>in HTML -</p>
  
  <pre><code>&lt;ul&gt;
      &lt;li v-for="officialScenario in filteredOfficialScenarios" v-bind:key="officialScenario.scenarioName"&gt;{{officialScenario}}&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Only scenarios with created > 2019-01-01 are supposed to be in the final output and the final output is to be sorted by descending created date.</p>
  
  <p>I tried figuring out sorting and filtering separately but have not gotten either to work, much less figure out how to combine them so they occur at the same time.  Here is what's been tried, to no avail -<br>
  for sorting -</p>
  
  <pre><code>computed: {
      filteredOfficialScenarios() {
          return [
              {"scenarioName": "scenario 1", "created": "2020-01-01T10:30:00"},
              {"scenarioName": "scenario 2", "created": "2019-01-01T09:15:00"},
              {"scenarioName": "scenario 3", "created": "2020-01-15T11:00:00"},
              {"scenarioName": "scenario 4", "created": "2018-01-31T11:00:00"},
              {"scenarioName": "scenario 5", "created": "2019-01-31T11:00:00"}
          ] | sortBy("created");
      }
  }
  </code></pre>
  
  <p>This is an attempt to get it to do a simple sort without being concerned with the sort direction.  This results in a console error and all output on the app's page in the browser disappears.</p>
  
  <p>for filtering -</p>
  
  <pre><code>computed: {
      filteredOfficialScenarios() {
          return [
              {"scenarioName": "scenario 1", "created": "2020-01-01T10:30:00"},
              {"scenarioName": "scenario 2", "created": "2019-01-01T09:15:00"},
              {"scenarioName": "scenario 3", "created": "2020-01-15T11:00:00"},
              {"scenarioName": "scenario 4", "created": "2018-01-31T11:00:00"},
              {"scenarioName": "scenario 5", "created": "2019-01-31T11:00:00"}
          ] | filter(function (scenario) { return scenario.created &gt; "2019-01-01"} );
      }
  }
  </code></pre>
  
  <p>This results in a console error and all output on the app's page in the browser disappears.</p>
  
  <p>Is there a way to do sorting and filter AND get them to work simultaneously?</p>