代码之家  ›  专栏  ›  技术社区  ›  craig

语义UI的search元素返回TypeError

  •  0
  • craig  · 技术社区  · 6 年前

    Using Different Response Fields

    当我尝试使用搜索时,我得到:

    enter image description here

    enter image description here

    <!-- Semantic UI-->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
    
    <!-- font awesome -->
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.2/css/all.css" integrity="sha384-/rXc/GQVaYpyDdyxK+ecHPVYJSN9bmVFBvjA/9eOB+pb3F2w2N6fc5qB9Ew5yIns" crossorigin="anonymous">
    
    <!-- jQuery -->
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    
    <!-- Semantic UI-->
    <script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>
    

    我已经在页面主体中定义了搜索,包括文档就绪脚本:

    <script type="text/javascript">
    $(document).ready(function(){
      console.log('ready');
      console.debug('steady');
    
      $('.ui.search')
        .search({
          apiSettings: {
            url: '//api.github.com/search/repositories?q={query}'
          },
          fields: {
            results : 'items',
            title   : 'name',
            url     : 'html_url'
          },
          minCharacters : 3
        });
    
    });
    </script>
    <div class="ui search">
      <div class="ui left icon input">
        <input class="prompt" type="text" placeholder="Search GitHub">
        <i class="github icon"></i>
      </div>
    </div>
    

    在浏览器控制台中,我得到一个错误:

    TypeError:P.ajax不是函数[了解更多]

    enter image description here

    **编辑**

    我按照 instructions

    我移动了文件的内容 dist 我的应用程序的文件夹 public 文件夹,现在类似于:

    enter image description here

    我修改了页面的引用以包含所需的组件:

    <link rel="stylesheet" type="text/css" href="semantic.min.css">
    <link rel="stylesheet" type="text/css" href="components/search.min.css">
    <script src="semantic.min.js"></script>
    <script src="components/search.min.js"></script>
    

    现在我得到一个不同的类型错误:

    enter image description here

    **/编辑**

    我错过了什么?

    1 回复  |  直到 6 年前
        1
  •  0
  •   craig    6 年前

    我使用的是jQuery的精简版本:

    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    

    当我改用普通版本时:

    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
    

    搜索工作如期进行。