私はこのようなReactjsコンポーネントで<a href="https://www.shieldui.com/documentation/grid/javascript/columns" rel="nofollow noreferrer">Shield UI grid</a>を使用していたReactJS

Question

と盾UIグリッドを使用する：

class Grid extends Component { 

    componentDidMount() { 

    $("#grid").shieldGrid({ 
     dataSource: { 
      remote: { 
       read: "http://jsonplaceholder.typicode.com/todos", 
       modify: { 
        create: { 
         url: "/gridData/EmployeeCreate", 
         type: "post", 
         data: function (edited) { 
          return { 
           userId: edited[0].data.userId, 
           id: edited[0].data.id, 
           title: edited[0].data.title, 
           completed: edited[0].data.completed 
          }; 
         } 
        }, 
        update: { 
         url: "/employees/EmployeeUpdate", 
         type: "post", 
         data: function (edited) { 
          return { 
           userId: edited[0].data.userId, 
           id: edited[0].data.id, 
           title: edited[0].data.title, 
           completed: edited[0].data.completed 
          }; 
         } 
        }, 
        remove: { 
         url: "/employees/EmployeeRemove", 
         type: "post", 
         data: function (removed) { 
          return { ID: removed[0].data.userId }; 
         } 
        } 
       } 
      }, 
      schema: { 
       fields: { 
        userId: { path: "userId", type: String }, 
        id: { path: "id", type: String }, 
        title: { path: "title", type: String }, 
        completed: { path: "completed", type: Boolean } 
       } 
      }, 
      group:[{ field: "id", order: "desc" }], 
     }, 
     paging: { 
      pageSize: 10, 
      messages: { 
       infoBarTemplate: "{0} - {1} از {2} رکورد" 
      } 
     }, 
     rowHover: false, 
     columns: [ 
      { field: "id", title: "id", width: "100px" }, 
      { field: "userId", title: "userId"}, 
      { field: "title", title: "title" }, 
      { field: "completed", title: "completed" }, 
      { 
       width: 150, 
       title: " ", 
       buttons: [ 
        { commandName: "edit", caption: "ویرایش" }, 
        { commandName: "delete", caption: "حذف" } 
       ] 
      } 
     ], 
     editing: { 
      enabled: true, 
      mode: "popup", 
      confirmation: { 
       "delete": { 
        enabled: true, 
        template: function (item) { 
         return "Delete product with name '" + item.id + "'?"; 
        } 
       } 
      } 
     }, 
     toolbar: [ 
      { 
       buttons: [ 
        { commandName: "insert", caption: "+ جدید" } 
       ], 
       position: "top" 
      } 
     ], 
      grouping: { 
      showGroupHeader: true, 
      allowDragToGroup: true, 
      message: "برای گروهبندی ستونی را انتخاب کنید" 
     }, 
     scrolling: true, 
     resizing: true, 
     sorting:true 
    }); 

    var dataSource = $("#grid").swidget().dataSource, 
      input = $("#filterbox input"), 
      timeout, 
      value; 
     input.on("keydown", function() { 
      clearTimeout(timeout); 
      timeout = setTimeout(function() { 
       value = input.val(); 
       if (value) { 
        dataSource.filter = { 
         or: [ 
          { path: "id", filter: "contains", value: value }, 
          { path: "userId", filter: "contains", value: value }, 
          { path: "title", filter: "contains", value: value }, 
          { path: "completed", filter: "contains", value: value } 
         ] 
        }; 
       } 
       else { 
        dataSource.filter = null; 
       } 
       dataSource.read(); 
      }, 300); 
    }); 
    } 

    render() { 

    return (
     <div className="sui-rtl"> 
      <div id="filterbox"> 
       <input type="text" placeholder="جستجو کنید..."/> 
      </div> 
      <div id="grid">111</div> 
     </div> 
    ); 
    } 
} 

export default Grid; 

すべてが正常に動作しますが、私はペルシャ数字に英語の数字から変換したいです。私はcomponentDidMountでコード変換を変更しましたが、何も変わりませんでした。

どのように英語の数字をペルシア語の数字に変換できますか？

Answer 1

あなたがこれを行うには、このスタックオーバーフローの質問にユーティリティ機能の束があります

how to replace numbers in body to persian numbers?

をそして、あなたはまた、この目的のためにヘルパー機能を提供し、このライブラリを持っている：

https://github.com/usablica/persian.js

Answer 2

pageLabelTemplateプロパティを使用すると、次のようにページ番号をペルシャ文字列に変換できます。

$("#grid").shieldGrid({ 
    paging: { 
     pageSize: 20, 
     messages: { 
      pageLabelTemplate: function(num) { 
       return "Persian " + num; 
      } 
     } 
    } 
});