Skip to content

1.3.0

Choose a tag to compare

View all tags
@pardnchiu pardnchiu released this 16 Aug 20:08
1.3.0
9744863

Overview

This update introduces several new features for PD tags and functions, enhancing style setting, case adjustment, and date conversion capabilities.

PD

New Features

  • Added support for quick style settings with the following PD tags: :hide, :padding, :margin, :border, :border-radius, :outline, :box-shadow.
  • Added attribute :once, which supports actions that are executed only once.
  • Added UPPER() and LOWER() functions to adjust string case.

    Example

    <body id="app">
      <p>{{ UPPER(test1) }} {{ LOWER(test2) }}</p>
</body>
<script>
      const app = new PD({
              id: "app",
              data: {
                  test1: "upper",
                  test2: "LOWER"
              }
      });
</script>

    Result

    <body id="app">
    <p>UPPER lower</p>
</body>
  • Added DATE() function to convert a timestamp into a formatted date.

    Example

    <body id="app">
    <p>{{ DATE(now, YYYY-MM-DD hh:mm:ss) }}</p>
</body>
<script>
    const app = new PD({
        id: "app",
        data: {
            now: Math.floor(Date.now() / 1000)
        }
    });
</script>

    Result

    <body id="app">
    <p>2024-08-17 03:40:47</p>
</body>

概述

此更新為 PD 引入了多項新功能，增強了樣式設置、大小寫調整以及日期轉換的功能。

PD

新功能

  • 新增對以下 PD 標籤快速設置樣式的支持：:hide、:padding、:margin、:border、:border-radius、:outline、:box-shadow。
  • 新增 PD 標籤 :once，支援僅執行一次的操作。
  • 新增 UPPER() 和 LOWER() 函數來調整字串大小寫。

    範例

    <body id="app">
      <p>{{ UPPER(test1) }} {{ LOWER(test2) }}</p>
</body>
<script>
      const app = new PD({
              id: "app",
              data: {
                  test1: "upper",
                  test2: "LOWER"
              }
      });
</script>

    結果

    <body id="app">
    <p>UPPER lower</p>
</body>
  • 新增 DATE() 函數將 timestamp 轉換為格式化日期。

    範例

    <body id="app">
    <p>{{ DATE(now, YYYY-MM-DD hh:mm:ss) }}</p>
</body>
<script>
    const app = new PD({
        id: "app",
        data: {
            now: Math.floor(Date.now() / 1000)
        }
    });
</script>

    結果

    <body id="app">
    <p>2024-08-17 03:40:47</p>
</body>
Assets 2
Loading