Vue templates: avoid functions, use computed properties instead

แชร์
ฝัง
  • เผยแพร่เมื่อ 12 ธ.ค. 2024

ความคิดเห็น • 6

  • @kristiyan.zhelyazkov
    @kristiyan.zhelyazkov 2 ปีที่แล้ว +3

    you can pass parameters to computed properties too:
    const fullName = computed(() => (person) => `${person.firstName} ${person.lastName}`);

    {{ fullName(person) }}

    • @cdruc
      @cdruc  2 ปีที่แล้ว +2

      Oh, this is clever, but it does not work as you'd think - the function still gets executed on every re-render:
      sfc.vuejs.org/#eNp9k01v2zAMhv8KIQxIiib2Pi+eW2zdDsMOO+02Dair0IkaWRL0ka4w9N9H2Y4Rd8BOlik+L8nXdM8+W1ucIrKK1V44aQN4DNHeci07a1yA3mG7AWE6GwPuErTOdMAZMZx95JprYbQPYNFYhXADlL7+xTVAL3cVvNlAK50PP5oOK1h9ybmNDlKvNqCaOf7VRbFKmxl7u8S+N+L4AjDO4/Ml8m6J3EmllshddO4SeL8EvsX9YQnkql2jL5kPS+anawR1saTMQaMfoN9XZNBojzBRh8md1zl8vmijUpmku7PH6/UV3NzC2qLzRg9n6HMLmTAKC2X269UZpOSnxgP+QZHhVRYHqhOi03D/qh9VirntBHPs3HW6JyZlsC7HJaDPTy8BO6uagPQGUEc1POmkJJy2rXE3nI1KIPW0AJxBdcTn+aaQO84mjqbo53nn6VKaVEslx0LlVKl+iCGQ+CehpDiS5OjLYOX1NclKLRx2SMZus/TocUp1OYIkUpfzDGzDxo3edo0tHqk27fxgK58uPGfVaHSODQte0eEQgvVVWfpW5D/l0RfG7Us6FY7qyQ4L9N32wZknj46EORv2ZdIoKXhCt3Wod+jQ/U/zReo/ulmW3Eos/QUUJEDm

    • @kristiyan.zhelyazkov
      @kristiyan.zhelyazkov 2 ปีที่แล้ว

      @@cdruc Yep, you're right. This will cause a performance issue

  • @crivion
    @crivion 2 ปีที่แล้ว

    Hey Constantin,
    Great content as always your channel is very underrated
    One question: which theme & font are you using for your IDE?
    Thanks

    • @cdruc
      @cdruc  2 ปีที่แล้ว

      hey, thanks! I'm using phpstorm with material ui darker contrast theme (with some minor changes).
      the font used in this video is Dank Mono, but in other videos I use other fonts like Jetbrains Mono / Menlo / Operator Mono - still undecided which one I like best :D

  • @andreafrattaruolo7968
    @andreafrattaruolo7968 2 ปีที่แล้ว +1

    Great