JS不显示结果| Python | Eel

Question

我解决不了这个问题。我写了一个程序，下面是它的简短描述： 一种应用程序，其逻辑是用python编写的，界面是用HTML和CSS呈现的。Python导入的模块eel。Python有一个返回数组的函数。在JS中，将创建一个变量，该变量接受函数的结果，然后将结果写入HTML类。这就是它的样子：

• Python代码

   import eel
   import datetime
   import sys
  
  
   eel.init("web")
  
   isoWD = datetime.datetime.today().isoweekday()
  
   @eel.expose
   def some_func():
       if isoWD == 1:
           result = ['elems', 'elems', 'elems', 'elems', 'elems', 'elems']
  
       elif isoWD == 2:
           result = ['elems', 'elems', 'elems', 'elems', 'elems', 'elems']
  
       elif isoWD == 3:
           result = ['elems', 'elems', 'elems', 'elems', 'elems', 'elems']
  
       elif isoWD == 4:
           result = ['elems', 'elems', 'elems', 'elems', 'elems', 'elems']
  
       elif isoWD == 5:
           result = ['elems', 'elems', 'elems', 'elems', 'elems', 'elems']
  
       elif isoWD == 6:
           result = ['elems', 'elems', 'elems', 'elems', 'elems', 'elems']
  
       elif isoWD == 7:
           sys.exit()
  
       return result
  
  
   eel.start("main.html", size=(325, 450))
  

• HTML代码

function display() { var res = eel.some_func(); for (var i = 0; i <= 'block__les'.length; i++) { document.getElementsByClassName('block__les')[i].innerHTML = res[i]; } } display();

<div class="wrapper">
  <div class="block">
    <div class="block__num">
      <p>(1)</p>
    </div>
    <div class="block__les"></div>
    <div class="block__time">09.00 - 09.30</div>
  </div>
  <div class="block">
    <div class="block__num">
      <p>(2)</p>
    </div>
    <div class="block__les"></div>
    <div class="block__time">09.40 - 10.10</div>
  </div>
  <div class="block">
    <div class="block__num">
      <p>(3)</p>
    </div>
    <div class="block__les"></div>
    <div class="block__time">10.20 - 10.50</div>
  </div>
  <div class="block">
    <div class="block__num">
      <p>(4)</p>
    </div>
    <div class="block__les"></div>
    <div class="block__time">11.00 - 11.30</div>
  </div>
  <div class="block">
    <div class="block__num">
      <p>(5)</p>
    </div>
    <div class="block__les"></div>
    <div class="block__time">11.40 - 12.10</div>
  </div>
  <div class="block">
    <div class="block__num">
      <p>(6)</p>
    </div>
    <div class="block__les"></div>
    <div class="block__time">12.20 - 12.50</div>
  </div>
  <div class="block">
    <div class="block__num">
      <p>(7)</p>
    </div>
    <div class="block__les"></div>
    <div class="block__time">13.00 - 13.30</div>
  </div>
  <div class="block">
    <div class="block__num">
      <p>(8)</p>
    </div>
    <div class="block__les"></div>
    <div class="block__time">13.40 - 14.10</div>
  </div>
</div>

Answer 1

为了获得从暴露给eel的python函数发送的结果，javascript函数，display，应该变成async函数，我们应该等待来自python函数的结果

因此，显示功能变为：

<script type="text/javascript">
async function display() {
  var res=await eel.some_func()();
  for (var i = 0; i <= document.getElementsByClassName('block__les').length ; i++) {
    document.getElementsByClassName('block__les')[i].innerHTML = res[i];
  }
}
display();
</script>

另一件事应该提到，但它与eel无关，在display函数中，'block\u les'。length没有给出类“block\u les”的项数，但它给出了单词block__les的字符数，即10

为了计算类“block_u_ules”的项数，我们可以使用document.getElementsByClassName（'block_u_ules'）。length，它给出了8的正确数字

当然，别忘了把

<script type="text/javascript" src="/eel.js"></script>

在main.html的头部部分

最后，不要忘记改变：

result = ['elems', 'elems', 'elems', 'elems', 'elems', 'elems']

变成8个项目以匹配HTML中显示的项目数

result = ['elems', 'elems', 'elems', 'elems', 'elems', 'elems', 'elems', 'elems']