在 Electron 中使用 Materialize-CSS 的导航栏中的选项卡不起作用。选项卡没有更改，它们的内容也没有正确显示。
一些代码只是从模板或文档页面复制和粘贴，我正在使用 Electron 学习 JS 和 HTML。
https://codepen.io/anon/pen/eyVQKx
<DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<!--Diz ao Electron que o App é optimizado para várias telas-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Whiteflag's Developer Tools</title>
<!--Importando Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!--Importando materialize.css-->
<link type="text/css" rel="stylesheet"
href="./assets/materialize-css/css/materialize.min.css" media="screen,projection"/>
<!-- Script Requerido antes de Importar Scripts -->
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
<!-- Importando Scripts -->
<script src="./assets/jquery/dist/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
crossorigin="anonymous"></script>
<script> require('./renderer.js'); </script>
<script type="text/javascript" src="./assets/materialize-css/js/materialize.min.js"></script>
<script> window.$ = window.jQuery = require('./assets/jquery/dist/jquery.min.js');</script>
<script> window.Hammer = require('./assets/hammer/hammer.min.js');</script>
<!-- Script Requerido depois de Importar Scripts -->
<script>if (window.module) module = window.module;</script>
</head>
<!-- Navbar do aplicativo, componente do MaterializeCSS -->
<div class="navbar-fixed">
<nav class="nav-extended" id="navbar">
<div class="nav-wrapper">
<a href="#" class="brand-logo center">Developer Tools</a>
</div>
<div class="nav-content" id="navbarcontent">
<ul class="tabs tabs-transparent tabs-fixed-width" id="tabs">
<li class="tab"><a href="#test1">Test 1</a></li>
<li class="tab"><a class="active" href="#test2">Test 2</a></li>
<li class="tab disabled"><a href="#test3">Disabled Tab</a></li>
<li class="tab"><a href="#test4">Test 4</a></li>
</ul>
</div>
</nav>
</div>
<div id="test1" class="col s12">Test 1</div>
<div id="test2" class="col s12">Test 2</div>
<div id="test3" class="col s12">Test 3</div>
<div id="test4" class="col s12">Test 4</div>
库和 CSS 文件中没有任何修改。
谢谢。等待回应。
最佳答案
我已经更新了你的codepen https://codepen.io/anon/pen/WgKwje
如果你想让它与 Electron 一起工作。
npm install materialize-css@next
然后在 index.html 中包含 materialize css 和 js 在主体标签调用 M.AutoInit() 的末尾
<script>M.AutoInit();</script>
关于javascript - Materialize-CSS Navbar 标签不适用于 Electron，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48177372/