आयात काम कर रहे एक जावास्क्रिप्ट फ़ाइल में दुर्बल

0

सवाल

मैं निर्माण कर रहा हूँ एक app में दुर्बल और मैं कोशिश कर रहा हूँ करने के लिए जोड़ने के लिए यह एक पहले से लिखा .js फ़ाइल. मैं करने की कोशिश की यह आयात में main.js फ़ाइल है, लेकिन मुझे एक त्रुटि देता है: Cannot read properties of null (reading 'offsetHeight') इस .js फ़ाइल:

[...]
function colorSubheadings() {
    // Replace subheading background colors
    var redStart = 255;
    var greenStart = 255;
    var blueStart = 255;
    var redEnd = 249;
    var greenEnd = 250;
    var blueEnd = 251;

    var redDiff = redEnd - redStart;
    var greenDiff = greenEnd - greenStart;
    var blueDiff = blueEnd - blueStart;

    var page = document.querySelector('.page');
    var pageHeight = page.offsetHeight;

    var subheadings = document.getElementsByClassName('.chapter');
    for (var i = 0; i < subheadings.length; i++) {
        // Get the position relative to .page
        var span = subheadings[i].querySelector('span');
        var factor = span.offsetTop / pageHeight;

        var r = Math.floor(redDiff * factor + redStart);
        var g = Math.floor(greenDiff * factor + greenStart);
        var b = Math.floor(blueDiff * factor + blueStart);
        var color = 'rgb(' + r + ',' + g + ',' + b + ')';

        // Color background based on position
        span.style.backgroundColor = color;
        span.style.boxShadow = '11px 0 0 ' + color + ', -13px 0 0 ' + color;
    }
}
[...]

और यह है .svelte फ़ाइल:

<script>
 //some functions
</script>
<div class="page">
[...]
<div class="chapter-sidebar">
    <div class="sidebar js-sidebar">
        <div class="sidebar__wrapper">
            <ul class="sidebar__list">
            {#each files as { file } (file.name)}
                <li class="sidebar__list-item">
                    <a class="sidebar__link" href="#temp">{file.name.split('.').slice(0, -1).join('.')}</a>
                </li>
            {/each}
            </ul>
        </div>
    </div>

में .svelte फ़ाइल वहाँ है एक पार्श्व नेवबार, बस की तरह यह. वेनिला में html यह पूरी तरह से काम करता है, लेकिन दुर्बल वहाँ कुछ कीड़े की तरह, नेवबार नहीं करता है, "छड़ी" एक जगह में: मैं नीचे स्क्रॉल यदि यह बनी हुई है के शीर्ष पर, पृष्ठ के insted में रहते हैं एक particuar की स्थिति, स्क्रीन "निम्नलिखित" उपयोगकर्ता स्क्रॉल. तो, मैं क्या कर सकते हैं का उपयोग करने के लिए इस .js फाइल में दुर्बल परियोजना? मैं भी करने की कोशिश की , इस समाधान है, लेकिन यह नहीं था मेरे लिए काम किया. धन्यवाद में advace.

html javascript svelte
2021-11-22 18:19:54
2

सबसे अच्छा जवाब

1

कहाँ है colorSubheadings() समारोह कहा जाता है?
(मैं देख रहा हूँ var subheadings = document.getElementsByClassName('.chapter') लेकिन कोई तत्वों के साथ वर्ग 'के अध्याय' में दुर्बल फाइल)

मैं सुझाव है कि आप या तो की कोशिश

  1. आयात .जे एस फ़ाइल में index.html में yourproject/puplic फ़ोल्डर के बाद से <script src="/build/bundle.js"></script> (मामले में इस समारोह में कहा जाता है के अंदर एक ही .js फाइल)
  2. कार्य को चलाने के अंदर onMount में .svelte घटक (.js फ़ाइल के अंदर yourproject/src फ़ोल्डर के साथ निर्यात समारोह export colorSubheadings() {...})
    import {onMount} from 'svelte'
    import {colorSubheadings} from './xy.js'
        
    onMount(()=> {
         colorSubheadings()
    })
2021-11-22 22:11:06
1

आप की जरूरत है करने के लिए निर्यात समारोह में अपनी js फाइल को इससे पहले कि आप आयात कर सकते हैं यह में अपने .दुर्बल फ़ाइल (या अन्य जे एस फ़ाइल).

export function colorSubheadings() {
...
}
2021-11-23 16:27:24

अन्य भाषाओं में

यह पृष्ठ अन्य भाषाओं में है

Русский
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................

इस श्रेणी में लोकप्रिय

लोकप्रिय सवाल इस श्रेणी में