Why isn't computed working in vue3?

Question

Vue.js

<script>
function setWidth(width) {
  if (width > 1600) return "xlg-max";
  else if (width < 1600 && width > 1366) return "xlg";
  else if (width < 1366 && width > 1280) return "lg";
  else if (width < 1280 && width > 1024) return "md";
  else if (width < 1024 && width > 768) return "tablet";
  else if (width < 768 && width > 480) return "sm";
  else if (width < 480) return "xs";
}
import { onMounted, provide, reactive, computed } from "vue";
import { useStore } from "vuex";
export default {
  name: "App",
  setup() {
    let windowSize = reactive({
      width: 0,
      breakpoint: null,
    });
    provide("windowSize", windowSize);

    function setWindowSize() {
      windowSize.breakpoint = setWidth(window.innerWidth);
      windowSize.width = window.innerWidth;
    }
    onMounted(() => {
      setWindowSize();
      window.addEventListener("resize", setWindowSize);
    });
    const store = useStore();
    store.dispatch("boards/getBoards").then((event) => console.log(event));
    const boards = computed(() => {
      return store.getters["boards/getBoards"];
    });

    return boards;
  },
};
</script>

Computed does not work, there is even a simple way to return a primitive in it, what's wrong?

Answer 1

setup() {
  ...
  const boards = computed(() => {
    return store.getters["boards/getBoards"];
  });

  return boards;
},

And if you had two computed properties, what would you return from setup? In general, what should be returned from setup? Open the documentation and understand.