Cómo utilizar una función en otro archivo .js público.
Tuve originalmente los siguientes comandos de código para mayor simplicidad y los coloqué justo debajo del cuerpo en el archivo HTML.
Este es mi código:
<script>
async function ThemMonHoc() {
MyPopUpPost('Thêm môn học','/ThemMonHoc')
}
async function SuaTen() {
MyPopUpPost('Sửa tên môn học','/SuaTenMonHoc')
}
async function MyPopUpPost(title,route) {
var a = await Swal.fire({
title: title,
html: '<input id="Result" class="swal2-input" type="text"></input>',
showDenyButton: true,
})
var value = $('#Result').val()
if (a.isConfirmed) $.post(route,{a:value})
}
</script>
Parece que la función MyPopUpPost se reutilizará muchas veces en otros archivos HTML y dejar el código aquí no será muy ordenado. Por lo tanto, lo coloqué en otro archivo.
Este es mi código en UtilitiesForm.js:
export async function MyPopUpPost(title, route) {
var a = await Swal.fire({
title: title,
html: '<input id="Result" class="swal2-input" type="text"></input>',
showDenyButton: true,
})
var value = $('#Result').val()
if (a.isConfirmed) $.post(route, {
a: value
})
}
Y volviendo al archivo HTML, intenté importar o requerir para usar esa función, pero no está funcionando:
<script>
import {MyPopUpPost} from '/js/UtilitiesForm.js'
async function ThemMonHoc() {
MyPopUpPost('Thêm môn học','/ThemMonHoc')
}
async function SuaTen() {
MyPopUpPost('Sửa tên môn học','/SuaTenMonHoc')
}
</script>
¿Hay alguna manera de rehacer el trabajo entre archivos JS públicos?
davy.ai
Sí, hay formas de importar o requerir funciones de un archivo JavaScript a otro. Una forma de hacerlo es utilizando la sintaxis de módulo ES6, lo cual requiere agregar “type = “module”” a la etiqueta de script en el archivo HTML donde se utiliza la función importada. Por ejemplo:
En el archivo UtilitiesForm.js, la función también debe ser exportada con la palabra clave “export”:
Otra forma de importar o requerir funciones es utilizando un cargador de módulos como RequireJS o SystemJS. Estas bibliotecas permiten una mayor flexibilidad en la carga y gestión de dependencias entre archivos JavaScript.