我如何 return 一个复杂的计算数组到我的 Svelte3 和 Javascript 中的箭头函数？

Question

自 Svelte v3 的新版本发布以来，我正在尝试将我的 v2 代码转换为新版本。我已将计算部分翻译成 Javascript 箭头函数。我想将函数的返回值设置为箭头函数所在的同一变量。我也试过做：

calendar = () => {...}

但在这种情况下，浏览器会解释箭头用作默认方法。

$: calendar => {
  // Function to calculate the calendar which updates every change
  let calendarArr = [];
  const offset = new Date(
    selectedDate.getFullYear(),
    selectedDate.getMonth(),
    1
  ).getDay();
  //number of days in selected month
  const days =
    32 -
    new Date(selectedDate.getFullYear(), selectedDate.getMonth(), 32).getDate();
  //for each potential cell(empty cells + day cells)
  for (let d = 0; d < days + offset; d++) {
    //start new row if 0th, 7th, 14th etc day
    if (d % 7 == 0) calendarArr.push([]);
    //push cell into the row
    calendarArr[Math.trunc(d / 7)].push(
      d - offset < 0
        ? null
        : new Date(
            selectedDate.getFullYear(),
            selectedDate.getMonth(),
            d - offset + 1
          )
    );
  }
  console.log(calendarArr);
  return calendarArr; // -> I want to set this as the calendar value
};

Answer 1

您可以像这样立即调用它：

calendar = (() => { ... })()

但更好的办法是给这个函数起个名字然后调用它:

function createCalendar() { ... }

calendar = createCalendar()

Answer 2

反应式语句 ($:) 不必是求值为单个值的表达式。您可以在反应语句中计算 calendarArr，然后将该值分配给组件中的另一个变量。

例子

let calendar;

$: {
  // Function to calculate the calendar which updates every change
  let calendarArr = [];
  const offset = new Date(
    selectedDate.getFullYear(),
    selectedDate.getMonth(),
    1
  ).getDay();
  //number of days in selected month
  const days =
    32 -
    new Date(selectedDate.getFullYear(), selectedDate.getMonth(), 32).getDate();
  //for each potential cell(empty cells + day cells)
  for (let d = 0; d < days + offset; d++) {
    //start new row if 0th, 7th, 14th etc day
    if (d % 7 == 0) calendarArr.push([]);
    //push cell into the row
    calendarArr[Math.trunc(d / 7)].push(
      d - offset < 0
        ? null
        : new Date(
            selectedDate.getFullYear(),
            selectedDate.getMonth(),
            d - offset + 1
          )
    );
  }
  console.log(calendarArr);
  calendar = calendarArr;
}

我如何 return 一个复杂的计算数组到我的 Svelte3 和 Javascript 中的箭头函数？

How could I return a complex calculated array to my arrow-function in Svelte3 and Javascript?

javascript

arrays

arrow-functions

svelte